jQuery使用ajaxStart()和ajaxStop()方法
ajaxStart()
和ajaxStop()
方法是绑定Ajax事件。ajaxStart()方法用于在Ajax请求发出前触发函数,ajaxStop()方法用于在Ajax请求完成后触发函数。它们的调用格式为:
$(selector).ajaxStart(function())
和$(selector).ajaxStop(function())
其中,两个方法中括号都是绑定的函数,当发送Ajax请求前执行ajaxStart()
方法绑定的函数,请求成功后,执行ajaxStop ()方法绑定的函数。
例如,在调用ajax()
方法请求服务器数据前,使用动画显示正在加载中,当请求成功后,该动画自动隐藏,如下图所示:
在浏览器中显示的效果:
从图中可以看出,由于使用ajaxStart()
和ajaxStop()
方法绑定了动画元素,因此,在开始发送Ajax请求时,元素显示,请求完成时,动画元素自动隐藏。
注意:该方法在1.8.2下使用是正常的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>使用ajaxStart()和ajaxStop()方法</title>
<script src="http://libs.baidu.com/jquery/1.8.2/jquery.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="divtest">
<div class="title">
<span class="fl">加载一段文字</span>
<span class="fr">
<input id="btnShow" type="button" value="加载" />
</span>
</div>
<ul>
<li id="divload"></li>
</ul>
</div>
<script type="text/javascript">
$(function () {
$("#divload").ajaxStart(function(){
$(this).html("正在请求数据...");
});
$("#divload").ajaxStop(function(){
$(this).html("数据请求完成!");
});
$("#btnShow").bind("click", function () {
var $this = $(this);
$.ajax({
url: "http://www.imooc.com/data/info_f.php",
dataType: "json",
success: function (data) {
$this.attr("disabled", "true");
$("ul").append("<li>我的名字叫:" + data.name + "</li>");
$("ul").append("<li>男朋友对我说:" + data.say + "</li>");
}
});
})
});
</script>
</body>
</html>
转载于:https://www.cnblogs.com/pcyy/p/5454603.html
jQuery使用ajaxStart()和ajaxStop()方法相关推荐
- Jquery ajax ajaxStart()和ajaxStop()加载前的优雅表现
Jquery中当一个Ajax请求启动时,并且没有其他未完成的Ajax请求时,将调用ajaxStart()方法.同样,ajaxStop()方法则是在所有Ajax请求都完成时调用.这些方法的参数都是一个函 ...
- Jquery Ajax调用aspx页面方法
原文:Jquery Ajax调用aspx页面方法 在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通 ...
- jQuery代码优化的9种方法
前面的话 本文将详细介绍jQuery代码优化的9种方法 用对选择器 在jQuery中,可以用多种选择器,选择同一个网页元素.每种选择器的性能是不一样的,应该了解它们的性能差异 1.最快的选择器:id选 ...
- 使用jquery获取url以及jquery获取url参数的方法
使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作1.jquery获取url很简单,代码如下1.window.location.href;其实只是用到了javascri ...
- jquery 取对象数组下标_JQuery使用index方法获取Jquery对象数组下标的方法
本文实例讲述了JQuery使用index方法获取Jquery对象数组下标的方法.分享给大家供大家参考.具体实现方法如下: /p> "http://www.w3.org/TR/xhtml ...
- 单击触发jquery.autocomplete的两种方法
jquery.autocomplete的参数 minChars设置为0时,默认要双击才会触发jquery.autocomplete,如果想要单击触发的话,得进行一定的处理才行.下面讲下我知道的单击触发 ...
- jquery.nicescroll完美滚动条使用方法
jquery.nicescroll完美滚动条使用方法(转) 配置参数 : 当调用"niceScroll"你可以传递一些参数来定制视觉方面: cursorcolor - 十六进制改变 ...
- jquery和zepto的扩展方法extend
jquery和zepto的扩展方法extend 总结下jQuery(3.1.1)和zepto(1.1.6)到底是如何来开放接口,使之可以进行扩展,两者都会有类型判断,本文使用简单的类型判断,暂不考虑兼 ...
- 网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法
网页加载的不同的方式 <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...
最新文章
- Could not set property 'xxx' of 'class 'xxx' with value 'xxx'
- 自监督和语言监督我全都要?Facebook多模态预训练模型SLIP给你答案!
- HTML5 新特性
- 怎么获取服务器接口文档,服务器接口获取数据
- [JZOJ P1271] [DP]集合求和
- 微信推视频红包;百度春晚红包互动 137 亿次;谷歌用皮影庆猪年 | 极客头条...
- redis实现分页排序
- python猜数字游戏
- Unity iOS使用ASTC格式纹理实践
- uni-app 常用内容
- 【Python基础知识整理】
- 19隆冬的倔强(updating)
- Oxffff转换成十进制
- 智能语音机器人语音识别系统
- 【论文阅读】【HLLDA】 A Hierarchical Model of Web Summaries
- BP神经网络以及python实现
- RK3588虚拟摄像头方案?
- java List 线程安全
- 教你用Python实现经典游戏《泡泡龙》
- 使用手机摄像头做网络ip摄像头 并用opencv获取rtsp视频流
热门文章
- Python jsonpath库的使用:解析json并将结果保存到文件
- 迄今看到的较为客观的一篇分析编程语言的文章
- 详解Spring Boot 2.X使用缓存@Cacheable代码示例
- 【学亮IT手记】PL/SQL编程-存储过程
- 北京卫生中级英语计算机考试成绩查询,2019年北京卫生专业技术资格成绩查询时间及入口...
- mysql php 变量赋值,mysql变量赋值要注意的_MySQL
- Source Insight,修改字体
- unity的vr场景怎么做_如何用Unity快速创建一个VR体验
- Qt / 窗体设置 Qt::WA_TranslucentBackground 为全黑的原因
- Cpp / 右值、纯右值、将亡值