Ajax开始执行时触发 ajaxStart() | Ajax 执行结束后触发 ajaxStop()

《1》

<html>
<head>
    <title></title>
    <script src="jquery-1.11.2.js"></script>
</head>
<body>
    <label for="UserId">请输入用户的ID编号:</label><input type="text" id="UserId" name="UserId" style="width:20px" />
    <input type="button" id="btnClick" value="提交" />
    <div id="loadMes" style="display:none">我正在努力加载中哦.....</div>
    <div id="loadData"></div>
</body>
</html>
<script type="text/javascript">
    $(function () {
        $("#btnClick").click(function () {
            var id=$("#UserId").val();
            $.get("loadHandler.ashx", { id: id }, function (data, status, jsXHR) {
                $("#loadData").text(data);
            });
        });

        //ajaxStart()与ajaxStop()这两个全局事件必须绑定在document元素上。

        //在Ajax异步发送请求时,遇到网速比较慢的时候,就会出现请求比时间较长的问题,用户等的不耐烦就会关闭页面。而如果在请求期间能给用户一些提示。比如:正在努力加载中... 那么用户可能会等久一点,体验就业好一些了。

        //jquery提供了两个全局事件,ajaxStart()和ajaxStop() 这两个全局事件,只要用户触发了Ajax,请求开始(仅仅是准备开始请求,还未完成请求)那么就会触发ajaxStart()这个事件。  当用户请求结束的时候就会触发ajaxStop()事件

        $(document).ajaxStart(function () { $("#loadMes").show(); }).ajaxStop(function () { $("#loadMes").hide(); alert("加载完毕") });

        //当然我们也可以分开来写

        $(document).ajaxStart(function () { $("#loadMes").show() });
        $(document).ajaxStop(function () { $("#loadMes").hide(); alert("请求完毕") })

    })

</script>

当点击提交按钮的时候 显示 “我正在努力加载中哦....”

时间: 2024-10-30 23:30:02

Ajax开始执行时触发 ajaxStart() | Ajax 执行结束后触发 ajaxStop()的相关文章

鼠标悬停(鼠标悬停一段时间后触发事件)一段时间后触发事件

<html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript"> var mytimer = null; function beginEvent(){ //window.setTimeout("alert('Hello, worl

给listview加动画,让动画执行结束后再刷新

问题:当给listview的条目加动画时,例如添加一个条目或者移除一个条目,动画效果会和添加删除条目的逻辑同时进行,因为动画并不是阻塞式的,这样会造成动画还没有结束,条目已经添加或者移除,从而动画作用在下面一个条目上面. 解决办法:想办法让动画执行完了之后再进行条目的添加或者移除操作(也就是刷新数据适配器),可以通过设置动画监听来实现,将要添加或者删除条目的逻辑放到动画监听的方法中,可以放到动画结束时调用的方法中,这样就保证了动画先执行,然后才刷新数据适配器 holder.iv_lock.set

Jquery ajax加载等待执行结束再继续执行下面代码操作

Jquery等待ajax执行完毕再继续执行下面代码的效果,具体代码如下,其实就是将 jquery ajax 函数的 async 参数设置为 false 即可,该参数默认为 true: $(document).ready(function(){ loadphpernote(); window.open('http://www.phpernote.com'); }); function loadphpernote(){ var url='http://www.phpernote.com/ajax.p

使用ajax后提交事件后禁用按钮,事件执行完毕后,重新启用按钮

一直想做这样的效果,实现的方法虽然不是很好,但效果还是出来了 <script runat="server"> /// <summary> /// 当Button2被点击,实际是Button3触发事件,这样就可以达到提交事件时禁用被提交的按钮效果 /// </summary> protected void Button_Click(object sender, EventArgs e) { System.Threading.Thread.Sleep(5

jquery的ajax提交时loading提示的处理方法

方法1:使用ajaxStart方法定义一个全局的“加载中...”提示 $(function(){     $("#loading").ajaxStart(function(){         $(this).html("<img src='/jqueryStu/images/loading.gif' />");       });       $("#loading").ajaxSuccess(function(){        

jquery ajax中success与complete的执行顺序

jquery ajax中success与complete的执行顺序 jquery中各个事件执行顺序如下: 1.ajaxStart(全局事件) 2.beforeSend 3.ajaxSend(全局事件) 4.success 5.ajaxSuccess(全局事件) 6.error 7.ajaxError (全局事件) 8.complete 9.ajaxComplete(全局事件) 10.ajaxStop(全局事件) 先执行success,再执行error,最后始终执行complete -------

ajax请求时session已过期处理方案

web系统中常常使用拦截器或过滤器实现权限拦截,判断用户是否登陆,若未登陆,跳转到登陆页,但当浏览器发的是ajax请求时,浏览器不会正常跳转,而是返回登陆页的HTML源码给ajax回调函数(当跳转的登陆页跨域时,会出现302错误),解决方案如下: 前端: //如果session超时或未登陆,则跳转到登陆页 $(document).ajaxComplete(function(event,request, settings){ var data=request.responseJSON; if(da

AJAX请求时status返回状态明细表

AJAX请求时status返回状态明细表 readyState的五种状态2010-03-04 18:24对于readyState的五种状态的描述或者说定义,很多Ajax书(英文原版)中大都语焉不详 在<Pragmatic Ajax A Web 2.0 Primer >中偶然看到对readyStae状态的介绍,感觉这个介绍很实在-- 比较理想的解释方法应该以"状态:任务(目标)+过程+表现(或特征)"的表达模式来对这几个状态进行定义 在<Pragmatic Ajax A

jquery通过ajax方法获取json数据不执行success

1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述3个标准写法:      1)键名称:用双引号括起:    2)字符串:用双引号括起:    3)数字,布尔值不需要使用双引号括起 : 注意:一定是双括号! 2.jQuery中ajax使用json数据类型总是跳过success