无涯教程-jQuery - jQuery.ajax( options )方法函数

无涯教程
168 阅读2分钟

jQuery.ajax(options)方法使用HTTP请求加载远程页面。

$.ajax()返回它创建的XMLHttpRequest。在大多数情况下，您不需要该对象直接进行操作，但是如果您需要手动中止请求，则可以使用该对象。

jQuery.ajax( options ) - 语法

$.ajax( options )

这是此方法使用的所有参数的描述-

  • options      -  一组配置Ajax请求的键/值对。

Sr.No. Option & Remark
1 async

一个布尔值，指示是否异步执行请求。默认值是true。
2 beforeSend

发送请求之前执行的回调函数。
3 complete

每当请求完成时执行的回调函数。
4 contentType

一个字符串，其中包含要为请求设置的MIME内容类型。默认值为application/x-www-form-urlencoded。
5 data

与请求一起发送到服务器的映射或字符串。
6 dataFilter

用于处理XMLHttpRequest的原始响应数据的函数。这是预过滤功能，用于清理响应。
7 dataType

一个字符串，用于定义期望从服务器返回的数据类型(xml，html，json或脚本)。
8 error

如果请求失败，则执行的回调函数。
9 global

一个布尔值，指示是否将由此请求触发全局AJAX事件处理程序。默认值是true。
10 ifModified

一个布尔值，指示服务器是否应在响应请求之前检查页面是否被修改。
11 jsonp

覆盖jsonp请求中的回调函数名称。
12 password

用于响应HTTP访问认证请求的密码。
13 processData

一个布尔值，指示是否将提交的数据从对象形式转换为查询字符串形式。默认值是true。
14 success

如果请求成功执行的回调函数。
15 timeout

毫秒数，超过该时间后，请求将在失败后超时。
16 timeout

设置请求的本地超时(以毫秒为单位)。
17 type

一个字符串，定义用于请求(GET或POST)的HTTP方法。默认值为GET。
18 url

包含请求发送到的URL的字符串。
19 username

用来响应HTTP访问认证请求的用户名。
20 xhr

用于创建XMLHttpRequest对象的回调。可用时默认为ActiveXObject(IE)，否则默认为XMLHttpRequest。

jQuery.ajax( options ) - 示例

假设无涯教程在result.html文件中包含以下HTML内容-

<h1>THIS IS RESULT...</h1>

以下是一个简单的示例，简单说明了此方法的用法。在这里，利用成功处理程序填充返回的HTML-

<html>
   <head>
      <title>The jQuery Example</title>
      <script type="text/javascript" 
         src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>

  </span><span class="tag">&lt;script</span><span class="pln"> </span><span class="atn">type</span><span class="pun">=</span><span class="atv">"text/javascript"</span><span class="pln"> </span><span class="atn">language</span><span class="pun">=</span><span class="atv">"javascript"</span><span class="tag">&gt;</span><span class="pln">
     $</span><span class="pun">(</span><span class="pln">document</span><span class="pun">).</span><span class="pln">ready</span><span class="pun">(</span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
        $</span><span class="pun">(</span><span class="str">"#driver"</span><span class="pun">).</span><span class="pln">click</span><span class="pun">(</span><span class="kwd">function</span><span class="pun">(</span><span class="pln">event</span><span class="pun">){</span><span class="pln">
           $</span><span class="pun">.</span><span class="pln">ajax</span><span class="pun">(</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
              url</span><span class="pun">:</span><span class="str">result.html</span><span class="pun">,</span><span class="pln">
              success</span><span class="pun">:</span><span class="kwd">function</span><span class="pun">(</span><span class="pln">data</span><span class="pun">)</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
                 $</span><span class="pun">(</span><span class="str">#stage</span><span class="pun">).</span><span class="pln">html</span><span class="pun">(</span><span class="pln">data</span><span class="pun">);</span><span class="pln">
              </span><span class="pun">}</span><span class="pln">
           </span><span class="pun">});</span><span class="pln">
        </span><span class="pun">});</span><span class="pln">
     </span><span class="pun">});</span><span class="pln">
  </span><span class="tag">&lt;/script&gt;</span><span class="pln">



</head>


<body>
<p>Click on the button to load result.html file:</p>


  </span><span class="tag">&lt;div</span><span class="pln"> </span><span class="atn">id</span><span class="pun">=</span><span class="atv">"stage"</span><span class="pln"> </span><span class="atn">style</span><span class="pun">=</span><span class="atv">"</span><span class="pln">background</span><span class="pun">-</span><span class="pln">color</span><span class="pun">:</span><span class="pln">blue</span><span class="pun">;</span><span class="atv">"</span><span class="tag">&gt;</span><span class="pln">
     STAGE
  </span><span class="tag">&lt;/div&gt;</span><span class="pln">
	
  </span><span class="tag">&lt;input</span><span class="pln"> </span><span class="atn">type</span><span class="pun">=</span><span class="atv">"button"</span><span class="pln"> </span><span class="atn">id</span><span class="pun">=</span><span class="atv">"driver"</span><span class="pln"> </span><span class="atn">value</span><span class="pun">=</span><span class="atv">"Load Data"</span><span class="pln"> </span><span class="tag">/&gt;</span><span class="pln">



</body>
</html>

这将产生以下输出-

参考链接

www.learnfk.com/jquery/ajax…

avatar
文章
阅读
粉丝