jqueery 的 ajax 用法说明

通用方式:
$.ajax(prop)    通过一个ajax请求,回去远程数据,prop是一个hash表,它可以传递的key/value有以下几种
         (String)type:数据传递方式(get或post)。
         ((String)url:数据请求页面的url
         ((String)data:传递数据的参数字符串,只适合post方式
         ((String)dataType:期待数据返回的数据格式(例如 "xml", "html", "script",或 "json")
         ((Boolean)ifModified: 当最后一次请求的相应有变化是才成功返回,默认值是false
         ((Number)timeout:设置时间延迟请求的时间。可以参考$.ajaxTimeout
         ((Boolean)global:是否为当前请求触发ajax全局事件,默认为true
         ((Function)error:当请求失败时触发的函数。
         ((Function)success:当请求成功时触发函数
         ((Function)complete:当请求完成后出发函数
jQuery代码及说明
$.ajax({url: "ajax.htm" ,
          success:
function
(msg){ 
                         $(div
"#a"
).html(msg);
                } 
    });
将ajax.htm返回的内容作为id为a的div内容
$.ajax({ url: "ajax.aspx" ,
              type:
"get"
,           
             dataType:
"html"
,
             data: 
"name=John&location=Boston"
,
             success:
function
(msg){ 
                                 $(
"#a"
).html(msg);
                              } 
         });

用get方式向ajax.aspx页面传参数,并将返回内容负给id为a的对象。

$.ajaxTimeout(time) 设置请求结束时间
   $.ajaxTimeout( 5000 )

其它简化方式:

$.get(url, params, callback)  用get方式向远程页面传递参数,请求完成后处理函数,除了url外,其它参数任意选择

$.get( "ajax.htm" , function(data){ $("#a").html(data)  })
$.get(   "ajax.asp"
            { name: 
"young", age: "25"
 },
            function(data){ alert("Data Loaded: " +
 data); }
        ) 
$.getIfModified(url, params, callback)  用get方式向远程页面传递参数,从最后一次请求后如果数据有变化才作出响应,执行函数callback
$.getJSON(url, params, callback)  用get方式向远程json对象传递参数,请求完成后处理函数callback。
$.getScript(url, callback)  用get方式载入并运行一个远程javascript文件。请求完成后处理函数callback。
$.post(url, params, callback)  用post方式向远程页面传递参数,请求完成后处理函数callback
load(url, params, callback)  载入一个远程文件并载入页面DOM中,并执行函数callback
$("#a").load("ajax.htm"function() { alert("load is done"); } );
向ajax.htm页面发出请求,将返回结果装入id为a的内容中,然后再执行函数callback。
loadIfModified(url, params, callback)  用get方式向远程页面传递参数,从最后一次请求后如果数据有变化才作出响应,将返回结果载入页面DOM中,并执行函数callback
ajaxStart(callback) 当ajax请求发生错误是时执行函数callback
ajaxComplete(callback)  当ajax请求完成时执行函数callback
ajaxError(callback)  当ajax请求发生错误时执行函数callback
ajaxStop(callback)  当ajax请求停止时执行函数callback
ajaxSuccess(callback)  当ajax请求成功时执行函数callback
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Ajax (Asynchronous JavaScript and XML) 是一种用于创建动态 Web 应用程序的技术,它可以在不重新加载整个页面的情况下向服务器发送请求并接收响应,这使得 Web 应用程序更加快速和交互性。Ajax 最常用于以下情况: 1. 实时搜索:当用户输入搜索关键字时,Ajax 可以通过异步请求向服务器发送搜索请求并返回结果,而不必等待整个页面重新加载。 2. 动态加载内容:当用户与页面交互时,Ajax 可以通过异步请求向服务器请求数据并动态更新页面内容,而不必重新加载整个页面。 3. 表单验证:当用户提交表单时,Ajax 可以通过异步请求向服务器发送请求并验证表单输入,而不必重新加载整个页面。 4. 轮询:当需要实时更新应用程序状态时,Ajax 可以通过定期发送异步请求来轮询服务器并获取最新的状态信息。 使用 Ajax 的基本步骤如下: 1. 创建 XMLHttpRequest 对象。 2. 使用 XMLHttpRequest 对象打开要发送的请求。 3. 设置请求头和请求参数。 4. 发送请求。 5. 在接收到响应后,使用回调函数处理响应。 以下是一个使用 Ajax 实现实时搜索的示例: HTML: ``` <input type="text" id="searchInput" onkeyup="search()"> <ul id="searchResults"></ul> ``` JavaScript: ``` function search() { var input = document.getElementById("searchInput").value; var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { var results = JSON.parse(xhr.responseText); var resultList = document.getElementById("searchResults"); resultList.innerHTML = ""; for (var i = 0; i < results.length; i++) { var li = document.createElement("li"); li.appendChild(document.createTextNode(results[i])); resultList.appendChild(li); } } }; xhr.open("GET", "search.php?q=" + input, true); xhr.send(); } ``` 在上面的示例中,当用户在输入框中输入文本时,search() 函数将被调用。该函数创建一个 XMLHttpRequest 对象并向服务器发送 GET 请求,请求的参数是输入框中的文本。在收到服务器响应后,search() 函数解析响应并动态更新页面内容。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值