Ajax 관련 기능

Ajax 관련 기능

jQuery는 Ajax 기능을 지원하는 몇 가지 관련 기능을 제공합니다.

1. jQuery.ajaxSetup( 옵션 )

반환 값 없음

설명:

전역 AJAX 기본 옵션 옵션을 설정합니다.

설명:

때때로 페이지의 모든 Ajax 속성의 기본 동작을 설정하려는 경우 이 기능을 사용하여 옵션을 설정할 수 있으며 그러면 모든 Ajax 요청의 기본 옵션이 변경됩니다.

예를 들어 페이지가 로드되면 다음 코드를 사용하여 Ajax의 기본 옵션을 설정합니다.

$.ajaxSetup({    url: "../data/AjaxGetMethod.aspx",    data: { "param": "ziqiu.zhang" },    global: false,    type: "POST",    success: function(data, textStatus) { $("#divResult").html(data); }});
此后我们可以使用无参数的get(),post()或者ajax()方法发送 ajax 请求.完整的示例代码如下:
<!doctype html><html><head>
 <meta charset="utf-8"/>
 <title>jQuery Ajax - Load</title>
 <script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
 <script>
   $(document).ready(function() {
     $.ajaxSetup({
         url: "../data/AjaxGetMethod.aspx",
         data: { "param": "ziqiu.zhang" },
         global: false,
         type: "POST",
         success: function(data, textStatus) {
           $("#divResult").html(data);
         }
     });
     $("#btnAjax").click(function(event) { $.ajax(); });
     $("#btnGet").click(function(event) { $.get(); });
     $("#btnPost").click(function(event) { $.post(); });
     $("#btnGet2").click(function(event) { $.get("../data/AjaxGetMethod.aspx",{ "param": "other" }); });
   });  </script></head>  <body>    
 <button id="btnAjax">nontransfer param call ajax() method</button><br />
 <button id="btnGet">nontransfer param call get() method</button><br />
 <button id="btnPost">nontransfer param call post() method</button><br />
 <button id="btnGet2">transfer param call get() method , use global default callback</button><br />
 <br />
 <div id="divResult"></div>
</body>
</html>

get() 또는 post() 메서드를 사용할 때 type 매개변수가 GET으로 다시 작성된다는 점에 유의하세요. 또는 POST, 기타 매개변수가 전달되지 않는 한 기본 전역 옵션이 사용됩니다. 예를 들어 마지막 버튼이 URL과 매개변수를 전달하는 등 특정 옵션이 전달되면 이 호출은 전달된 옵션을 기반으로 합니다. 콜백 함수와 같이 전달되지 않은 옵션은 여전히 전역 옵션을 사용하여 값을 설정합니다.

2.serialize( )

반환: String

설명:

순서 목록 테이블의 콘텐츠는 Ajax 요청에 사용되는 문자열입니다.

직렬화는 양식 데이터를 서버로 보낼 때 가장 일반적으로 사용됩니다. 직렬화된 데이터는 표준 형식이며 거의 모든 서버에서 지원될 수 있습니다.

최대한 정상적으로 작동하려면 직렬화되는 양식 필드에 이름 속성이 하나만 있어야 합니다.

name 속성을 다음과 같이 작성하세요. <input id="email" name="email" type="text" />

설명:

serialize() 함수는 양식 개체를 양식에 연결합니다. 문자열로 서버에 전송됩니다. Ajax를 사용하여 보낼 때 양식 데이터를 얻는 것이 편리합니다. 이는 Get 메서드를 통해 양식을 제출할 때 양식 개체의 이름/값이 자동으로 제출 URL에 배치되는 것과 유사합니다.

3.serializeArray( )

Returns: Array< Object>

설명:

JSON 개체를 얻으려면 이 함수를 사용하지만 jQuery는 JSON 개체를 JSON 문자열로 변환하는 방법을 제공하지 않습니다. . 따라서 원본 기사

에서 언급한 jquery.json 플러그인과 같은 플러그인을 사용해야 합니다.

지속적인 학습

새로운 파일

<html> <head> <script src="http://code.jquery.com/jquery-3.1.1.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("div").text($("form").serialize()); }); }); </script> </head> <body> <form action=""> 姓名: <input type="text" name="FirstName" value="Bill" /><br /> 职位: <input type="text" name="LastName" value="Gates" /><br /> </form> <button>序列化表单值</button> <div></div> </body> </html>

제출하다 코드 재설정

자동운전