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>
jQuery使用ajaxStart()和ajaxStop()方法的更多相关文章
- Jquery ajax ajaxStart()和ajaxStop()加载前的优雅表现
Jquery中当一个Ajax请求启动时,并且没有其他未完成的Ajax请求时,将调用ajaxStart()方法.同样,ajaxStop()方法则是在所有Ajax请求都完成时调用.这些方法的参数都是一个函 ...
- ajaxStart()和ajaxStop()方法
使用ajaxSetup()方法设置全局Ajax默认选项 使用ajaxSetup()方法可以设置Ajax请求的一些全局性选项值,设置完成后,后面的Ajax请求将不需要再添加这些选项值,它的调用格式为: ...
- ajaxStart()和ajaxStop()
Jquery中当一个Ajax请求启动时,并且没有其他未完成的Ajax请求时,将调用ajaxStart()方法.同样,ajaxStop()方法则是在所有Ajax请求都完成时调用.这些方法的参数都是一个函 ...
- 【锋利的jQuery】中全局事件ajaxStart、ajaxStop不执行
最近一直都在研究[锋利的jQuery],确实是一本好书,受益匪浅.但由于技术发展及版本更新等原因,里面还是有些坑需要踩的. 比如:第六章七节中提到的全局事件ajaxStart.ajaxStop照着案例 ...
- jQuery Ajax实例各种使用方法详解
在jquery中ajax实现方法分类很多种,如有:load.jQuery.get.jQuery.post.jQuery.getScript.jQuery Ajax 事件.jQuery.ajaxSetu ...
- Jquery中和ajax有关的方法
Jquery关于ajax有一系列的方法函数,单单知道$.ajax()显然是不够的,接下来我们对该系列的方法函数逐一研究下. ajaxComplete(callback).ajaxError(callb ...
- JQuery的核心的一些方法[扒来的]
JQuery的核心的一些方法 each(callback) '就像循环 $("Element").length; ‘元素的个数,是个属性 $("Element" ...
- jQuery中的事件绑定方法
在jQuery中,事件绑定方法大致有四种:bind(),live(), delegate(),和on(). 那么在工作中应该如何选择呢?首先要了解四种方法的区别和各自的特点. 在了解这些之前,首先要知 ...
- JQuery中each()的使用方法说明
JQuery中each()的使用方法说明 对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话说:jQuery提供的eac ...
随机推荐
- linux(以ubuntu为例)下Android利用ant自动编译、修改配置文件、批量多渠道,打包生成apk文件
原创,转载请注明:http://www.cnblogs.com/ycxyyzw/p/4555328.html 之前写过一篇<windows下Android利用ant自动编译.修改配置文件.批量 ...
- Haproxy配置支持https获取用户IP地址
global log 127.0.0.1 local0 chroot /var/lib/haproxy #chroot运行路径 pidfile /var/run/haproxy.pid #haprox ...
- 【NLP】word2vec
http://blog.csdn.net/mytestmy/article/details/26969149?utm_source=tuicool&utm_medium=referral
- 老鼠跑猫叫主人惊醒c++观察者模式实现
这个题目算是比较经典的观察者模式了,老鼠作为一个Subject,主动发出跑的动作,紧跟着猫由于老鼠的跑而发出叫声,主人也被惊醒,在这里猫跟主人都是被动的,是观察者角色,代码实现如下: class CS ...
- IIS出现The specified module could not be found解决方法
打开IIS 信息服务,在左侧找到自己的计算机,点右键,选择属性,在主属性中选编辑,打开“目录安全性”选项卡,单击“匿名访问和验证控制”里的“编辑”按钮,在弹出的对话框中确保只选中了“匿名访问”和“集成 ...
- MySQL降权:MySQL以Guests帐户启动设置方法
MySQL安装到Windows上,默认是以SYSTEM权限运行,如下图: SYSTEM是超级管理员.不是必须,不推荐用此权限运行任何程序. 本文将演示如何在GUEST帐户下运行MySQL. 第一步:建 ...
- php XML 读写 创建
一 .XML 读 1.1. 首先同目录定义好一个XML文件 : book.xml <?xml version="1.0" encoding="utf-8" ...
- mono+jexus 之连接数据库
System.ArgumentException Unable to find the requested .Net Framework Data Provider. It may not be in ...
- tengine-2.1.0 + lua + base64
参考:http://my.oschina.net/eduosi/blog/169606 安装 readline,lua 编译需要用到这个,centos 可以通过 yum 直接安装,如果不需要系统的,可 ...
- 惊涛怪浪(double dam-break) -- position based fluids
切入正题之前,先胡说八道几句. 据说爱因斯坦讲过:关于这个世界最难以理解的就是它是可以被理解的.人类在很长的时间里,都无法认知周围变幻莫测的世界,只能编造出无数的神祗来掌控世上万物的运行.到了近 ...