zoukankan      html  css  js  c++  java
  • js的onclick和jquery的bind事件执行先后顺序

    近期在项目中为每一个ajax触发按钮写正在加载的效果,用的是bootstarp

    代码如下

    $(function(){
            $('.btn').bind('click',function(e){
                var $btn = $(e.target)
                if ($btn.attr("data-loading-text")){
                    $("#data-loading-control").ajaxStart(function(evt, request, settings){
                        $btn.button('loading');
                    });
                    $("#data-loading-control").ajaxComplete(function(evt, request, settings){
                        $(".btn").button('reset');
                    });
                }
                    /*setTimeout(function(){
                            $btn.button('reset');
                        },1500);*/
                });
        });

    在每一个按钮的点击事件中,判断该按钮是否存在

    data-loading-control属性
    例如
    <button class="btn btn-primary" id="login-button" type="button" data-loading-text="正在登录">登录</button>

    如果有的话就开始监听ajax的start事件和complete事件,并显示正在登陆,完成后重置按钮的状态

    但是后来发现只有登录按钮可以正常,其他的按钮都不能显示正在执行的效果

    唯一的区别就是,登录按钮的时间是写在jquery的bind中,而其他的按钮为了方便都是直接写了onclick 事件,网上说onclick事件先于bind事件执行,这样就能解释通了。

    jquery在onclick事件中已经执行了ajax,然后才增加ajax的绑定监听,所以监听是无效的。

  • 相关阅读:
    Ruby on Rails中的Rake教程(Rake如何把我灌醉!)
    十一、Spring Boot 集成Shiro和CAS
    Spring Boot 快速入门
    一位创业者的血泪史----献给85前创业者的反思
    罗振宇送给新员工的四句话
    Axure 入门
    XMind常用快捷方式汇总
    CAS 单点登陆
    mysql互换表中两列数据
    mysql默认安装目录说明
  • 原文地址:https://www.cnblogs.com/yangchengInfo/p/3614278.html
Copyright © 2011-2022 走看看