首页 > Web开发 > 详细

jQuery中使用ajax

时间:2020-03-24 17:17:03      阅读:37      评论:0      收藏:0      [点我收藏+]

基本属性

$.ajax({
url:‘add.php‘,
type:‘post‘,
data:{id:1,name:‘ashen‘},
success:function(res){
console.log(res);
}
})
  • dataType:设置响应体数据类型

  • success函数:只有状态码为200即请求成功才会执行

  • error函数:只有请求不正常才执行,即状态码不是200

  • complete函数:请求完成后执行,即成功或失败都会执行

  • beforeSend函数:在发送请求之前执行

高度封装函数

  • $.get(url,数据,成功后执行的函数) 发送get请求

  • $.post(url,数据,成功后执行的函数) 发送post请求

  • $.getJSON(url,数据,成功后执行的函数) 发送get请求 并设置响应体为json格式

  • $.getScript() 发送get请求 并设置响应体为javascript格式

 

全局事件处理函数

  • $(selector).ajaxStart(function(){}); 给某一元素注册请求开始时触发的事件 全局事件处理函数

  • $(selector).ajaxStop(function(){}); 给某一元素注册请求结束时触发的事件 全局事件处理函数

  

其中加入css或其他效果,可以实现正在加载或加载进度条等用户体验性较好的页面

如:

$(document)
  .ajaxStart(function () {
    NProgress.start()
  })
  .ajaxStop(function () {
    NProgress.done()
  })

NProgress 实现进度条

 

$(selector).load()

  • 将$(selector)重新加载,通过load中的参数指定被载入的代码

  • load(url,数据,请求成功后回调的函数)

  • 默认使用 GET 方式 - 传递附加参数时自动转换为 POST 方式。jQuery 1.2 中,可以指定选择符,来筛选载入的 HTML 文档,DOM 中将仅插入筛选出的 HTML 代码。语法形如 "url #some > selector"。

jQuery中使用ajax

原文:https://www.cnblogs.com/ashen1999/p/12559667.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!