Question

我有一个带有两个类的元素，可触发两个点击事件。

现在我想取消绑定元素的一个事件，但我不知道哪个click事件与定义事件的类有关

这是我的代码：

这里是“a”元素

    <a id="addTechnicalCriteriaButton${parcel.id}" href="javascript:void(0);"
   class="col-xs-2 glossary-content addTechnicalCriteriaButton${parcel.id} addTechnicalCriteriaLink openDialog" data-parcel-id="${parcel.id}">
    <i class="glyphicon glyphicon-plus-sign"></i> <spring:message code="label.add"/>
</a>

这是我的js

         var openingDialogEvent = function () {
    $(".openDialog").on("click.modalDialog", function () {
        loadingOpeningDialog = true;
        currentElement = $(this);
        loadClickEvents();
        currentElement.off();
    });
};

在另一个js中

       $('.addTechnicalCriteriaLink').click(function () {
          if (loadingCriteriaDialog === false) {
               loadingCriteriaDialog = true;
                    $.when(addTechnicalCriteria($(this).data('parcel-id'))).then(function () {
                            loadingCriteriaDialog = false;
                        }
                    );
                }
            });

有什么想法吗？

Answer 1

删除事件处理程序与用于添加处理程序的类无关（然后处理程序附加到dom元素）。您可以使用事件命名空间来添加/删除特定处理程序，如

$('.c1').on('click.one', function() {
  snippet.log('c1 click');
});
$('.c2').on('click.two', function() {
  snippet.log('c2 click');
});

$('.one').click(function() {
  $('#c').off('click.one');
});
$('.two').click(function() {
  $('#c').off('click.two');
});

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="c" class="c1 c2">Test</button>
<button class="one">One</button>
<button class="two">Two</button>

Answer 2

您可以使用event.namespace绑定事件。然后您可以使用.off()使用 namespace

删除事件处理程序

＆＃13;

$(function() {
  $('.a').on('click.a', function() {
    alert('a clicked');
  });
  $('.b').on('click.b', function() {
    alert('b clicked');
  });

  $('div').off('click.a');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="a b">div</div>

＆＃13;

Answer 3

我们可以在使用jQuery附加处理程序时使用名称空间，以后我们可以参考。我们通过使用点.跟踪事件名称以及稍后要引用的唯一名称来执行此操作。 click.firstEvent。

这样做可以让我们稍后在我们的代码中取消绑定：

$('#someElement').bind('click.firstEvent', function () { /* do stuff */ }); $('#someElement').bind('click.secondEvent', function () {/ * do other stuff */});

现在我们可以使用我们提供的命名空间解除第一个事件的绑定。

$('#someElement').unbind('click.firstEvent');

在元素上按名称取消绑定事件

3 个答案: