Jquery禁用了一个事件,稍后重新激活它

时间:2015-01-31 17:23:52

标签: javascript javascript-events

1 - 我收集了一个带有data-needlogged属性的html标签。

2 - 我想禁用它上面的所有点击事件。

3 - 当用户点击我的元素时,我想显示authentification popin。

4 - 当用户将被记录时,我想启动事件而不是之前禁用的事件。

我尝试类似下面的代码,但它错过了“......?”一部分。

<a href="/play" data-btnplay data-needlogged="true">Play</a>

<script>
// 1 - some click events has been plug on the tag.
jQuery('[data-btnplay]').on('click', function() {
    alert('play');
    return false;
});

// 2 - disabled all click events
jQuery('[data-needlogged]').off('click');

// 3 - Add the click event to display the identification popin   
var previousElementClicked = false;
jQuery('body').on('click.needlogged', '[data-needlogged]="true"', function() {
    previousElementClicked = jQuery(this);
    alert('show the identification popin');
    return false;
});

jQuery(document).on('loginSuccess', function() {
    // 4 - on loginSuccess, I need to remove the "the show the identification popin" event. So, set the  data-needlogged to false
    jQuery('[data-needlogged]')
        .data('needlogged', 'false')
        .attr('data-needlogged', 'false');

    // 4 - enable the the initial clicks event than we disabled before (see point 2) and execute then.
    // ...?
    jQuery('[data-needlogged]').on('click'); // It doesn't work

    if (previousElementClicked) {
        previousElementClicked.get(0).click();
    }
});
</script>

感谢您的帮助

1 个答案:

答案 0 :(得分:0)

感谢您的回答。

它没有回答我的问题。

我会尝试更好地解释。

当我在needlogged元素上声明click事件时,我不知道是否已经有其他点击事件。因此,在您的示例中,您如何替换警报(&#39; play&#39;);最初的事件?

我需要找到一种方法

1 - 禁用元素上的所有点击事件。

2 - 在同一元素上添加点击事件

3 - 当触发器启动时,执行之前禁用的事件。

所以,我在stackoverflow

上找到了解决方案

在我的情况下,我不需要禁用和启用某些事件,但我需要在另一个事件之前设置点击事件。

<a href="/play" data-btnplay data-needlogged="true">Play</a>

<script>
// 1 - some click events has been plug on the tag.
jQuery('[data-btnplay]').on('click', function() {
    alert('play');
    return false;
});

// [name] is the name of the event "click", "mouseover", .. 
// same as you'd pass it to bind()
// [fn] is the handler function
jQuery.fn.bindFirst = function(name, fn) {
    // bind as you normally would
    // don't want to miss out on any jQuery magic
    this.on(name, fn);

    // Thanks to a comment by @Martin, adding support for
    // namespaced events too.
    this.each(function() {
        var handlers = $._data(this, 'events')[name.split('.')[0]];
        // take out the handler we just inserted from the end
        var handler = handlers.pop();
        // move it at the beginning
        handlers.splice(0, 0, handler);
    });
};

var previousElementClicked = false;

// set the needlogged as first click event
jQuery('[data-needlogged]').bindFirst('click', function(event) {
    //if the user is logged, execute the other click event
    if (userIsConnected()) {
        return true;
    }

    //save the click element into a variable to execute it after login success
    previousElementClicked = jQuery(this);

    //show sreenset
    jQuery(document).trigger('show-identification-popin');

    //stop all other event
    event.stopImmediatePropagation();
    return false;
});

jQuery(document).on('loginSuccess', function() {
    if (userIsConnected() && lastClickedElement && lastClickedElement.get(0)) {
        // if the user has connected with success, execute the click on the element who has been save before
        lastClickedElement.get(0).click();
    }
});