<p>출처 :&nbsp;<a href="http://webinformation.tistory.com/22" target="_blank" class="tx-link">http://webinformation.tistory.com/22</a></p><p><br></p><p><a href="http://motolies.tistory.com/514" target="_blank">2016/05/13 - [프로그램 자료/Java Script] - 비동기 로딩/로딩바 이미지 ajax loading image</a></p><p><br></p><p><br></p><div style="color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: D2Coding, Consolas, &quot;Courier New&quot;, monospace, Consolas, &quot;Courier New&quot;, monospace; font-size: 13px; line-height: 18px; white-space: pre;"><div><span style="color: #9cdcfe;">$</span>.<span style="color: #dcdcaa;">ajax</span>({</div><div>&nbsp; <span style="color: #9cdcfe;">url</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"example.php"</span>, <span style="color: #6a9955;">// 요청 할 주소</span></div><div>&nbsp; <span style="color: #9cdcfe;">async</span><span style="color: #9cdcfe;">:</span> <span style="color: #569cd6;">true</span>, <span style="color: #6a9955;">// false 일 경우 동기 요청으로 변경</span></div><div>&nbsp; <span style="color: #9cdcfe;">type</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"POST"</span>, <span style="color: #6a9955;">// GET, PUT, DELETE</span></div><div>&nbsp; <span style="color: #9cdcfe;">data</span><span style="color: #9cdcfe;">:</span> {</div><div>&nbsp; &nbsp; <span style="color: #9cdcfe;">Name</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"ajax"</span>,</div><div>&nbsp; &nbsp; <span style="color: #9cdcfe;">Age</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"10"</span>,</div><div>&nbsp; }, <span style="color: #6a9955;">// 전송할 데이터</span></div><div>&nbsp; <span style="color: #9cdcfe;">dataType</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"text"</span>, <span style="color: #6a9955;">// xml, json, script, html</span></div><div>&nbsp; <span style="color: #9cdcfe;">contentType</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"application/json; charset=utf-8"</span>,</div><div>&nbsp; <span style="color: #dcdcaa;">beforeSend</span><span style="color: #9cdcfe;">:</span> <span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {}, <span style="color: #6a9955;">// 서버 요청 전 호출 되는 함수 return false; 일 경우 요청 중단</span></div><div>&nbsp; <span style="color: #dcdcaa;">success</span><span style="color: #9cdcfe;">:</span> <span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {}, <span style="color: #6a9955;">// 요청 완료 시</span></div><div>&nbsp; <span style="color: #dcdcaa;">error</span><span style="color: #9cdcfe;">:</span> <span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>, <span style="color: #9cdcfe;">status</span>, <span style="color: #9cdcfe;">error</span>) {}, <span style="color: #6a9955;">// 요청 실패.</span></div><div>&nbsp; <span style="color: #dcdcaa;">complete</span><span style="color: #9cdcfe;">:</span> <span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {}, <span style="color: #6a9955;">// 요청의 실패, 성공과 상관 없이 완료 될 경우 호출</span></div><div>}).<span style="color: #dcdcaa;">always</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"finished"</span>);</div><div>});</div><div><br></div><div><br></div><div><br></div><br><div><span style="color: #9cdcfe;">$</span>.<span style="color: #dcdcaa;">get</span>(</div><div>&nbsp; <span style="color: #ce9178;">"example.php?Name=ajax&amp;Age=10"</span>,</div><div>&nbsp; <span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"success"</span>);</div><div>&nbsp; },</div><div>&nbsp; <span style="color: #ce9178;">"json"</span> <span style="color: #6a9955;">/* xml, text, script, html */</span></div><div>)</div><div>&nbsp; .<span style="color: #dcdcaa;">done</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"second success"</span>);</div><div>&nbsp; })</div><div>&nbsp; .<span style="color: #dcdcaa;">fail</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>, <span style="color: #9cdcfe;">status</span>, <span style="color: #9cdcfe;">error</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"error"</span>);</div><div>&nbsp; })</div><div>&nbsp; .<span style="color: #dcdcaa;">always</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"finished"</span>);</div><div>&nbsp; });</div><div><br></div><div><br></div><div><br></div><br><div><span style="color: #9cdcfe;">$</span>.<span style="color: #dcdcaa;">post</span>(</div><div>&nbsp; <span style="color: #ce9178;">"example.php?Name=ajax&amp;Age=10"</span>,</div><div>&nbsp; {</div><div>&nbsp; &nbsp; <span style="color: #9cdcfe;">Name</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"ajax"</span>,</div><div>&nbsp; &nbsp; <span style="color: #9cdcfe;">Age</span><span style="color: #9cdcfe;">:</span> <span style="color: #ce9178;">"10"</span>,</div><div>&nbsp; },</div><div>&nbsp; <span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"success"</span>);</div><div>&nbsp; },</div><div>&nbsp; <span style="color: #ce9178;">"json"</span> <span style="color: #6a9955;">/* xml, text, script, html */</span></div><div>)</div><div>&nbsp; .<span style="color: #dcdcaa;">done</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"second success"</span>);</div><div>&nbsp; })</div><div>&nbsp; .<span style="color: #dcdcaa;">fail</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>, <span style="color: #9cdcfe;">status</span>, <span style="color: #9cdcfe;">error</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"error"</span>);</div><div>&nbsp; })</div><div>&nbsp; .<span style="color: #dcdcaa;">always</span>(<span style="color: #569cd6;">function</span> (<span style="color: #9cdcfe;">jqXHR</span>) {</div><div>&nbsp; &nbsp; <span style="color: #dcdcaa;">alert</span>(<span style="color: #ce9178;">"finished"</span>);</div><div>&nbsp; });</div><br></div><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p>


jquery ajax get post 비동기 함수