为了账号安全,请及时绑定邮箱和手机立即绑定

jquery bind

jquery bind

largeQ 2018-12-06 20:55:46
<div class="divs"> <div></div> <div></div> <div></div> <div></div> </div> 我想给class="divs"下面的每个div加个bind的点击事件, 然后点击当中的任何一个div的时候我想解除,除当前div以外的div的 bind事件,会有三秒的延时,等延时结束后其它div就恢复bind,这个怎么做(简单说就是点击某个div禁用掉其它div的所以点击功能)
查看完整描述

5 回答

?
手掌心

TA贡献1942条经验 获得超3个赞

(function() {
    var time = 3;
    var index = -1;
    $('.divs div').bind('click', function() {
        var _this = $(this);
        var thisIndex = $('.divs div').index(_this);
        if(time <= 0) {
            time = 3;
            index = -1;
        }
        if(index < 0) {
            index = thisIndex;
            timeCounter();
        }
        if(time > 0 && index != _this.index()) {
            return false;
        }
        //
        console.log(_this.text());
    });
    function timeCounter() {
        var start = setTimeout(function() {
            --time;
            if(time < 0) {
                clearTimeout(start);
                return false;
            }
            setTimeout(arguments.callee, 1000);
        }, 1000);
    }
})();

查看完整回答
反对 回复 2018-12-24
?
慕码人8056858

TA贡献1803条经验 获得超6个赞

        $(window).load(function(){
            $(".divs div").bind("click",function(){
                var item=$(this);
                setTimeout(function(){
                $(".divs div").unbind("click");
                alert("移出其他事件");
                item.bind("click",function(){
                alert("只有我能点");
                })
                },3000);
            });
        });

HTML不变,将上面的代码加入js即可,我测试了,没问题。

查看完整回答
反对 回复 2018-12-24
?
繁星淼淼

TA贡献1775条经验 获得超11个赞

 这样不行,取消unbind再bind就没效了

查看完整回答
反对 回复 2018-12-24
?
PIPIONE

TA贡献1829条经验 获得超9个赞

@Mi文: 可以的吧,你只需要把第一次触发时间的Element用变量保存下来,我觉得应该好做吧~

查看完整回答
反对 回复 2018-12-24
?
慕无忌1623718

TA贡献1744条经验 获得超4个赞

如果通过委托,则可以这样:

 

//通过事件委托来做(jQuery.fn.on)
var lockDiv;
$('.divs').on('click', 'div', function () {
    if (lockDiv != null && lockDiv != this) return;
    lockDiv = this;
    var self = $(this);
    alert('你点击的div的逻辑');
    setTimeout(function () {
        lockDiv = null;
    }, 3000);
});

 

考虑到性能,不要频繁的bind/unbind事件,通过在事件中判定是否禁止此次逻辑即可。

 

也可以这样:

//每个div绑定,适用于div各自事件逻辑不同
var cacheIndex = -1;
$('.divs>div').each(function (i) {
    $(this).on('click', function () {
        if (cacheIndex !== -1 && cacheIndex != i) {
            alert('你的逻辑');
            setTimeout(function () {
                cacheIndex = -1;
            });
        }
    });
});

多使用jQuery.fn.on少使用jQuery.fn.bind,jQuery.fn.bind API已被废弃(好像是在1.7之后)

 

 

查看完整回答
反对 回复 2018-12-24
  • 5 回答
  • 0 关注
  • 659 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号