Question

我试图根据CSS类的存在来销毁一个函数。

我想查看课程.active，点击按钮切换此课程。我尝试使用

if(jQuery(#test).hasClass('.active')

但它只能工作一次，如果我删除.active仍然会运行此函数，而我想在删除.active类后将其销毁。

我也试过.unbind()但没有用。

请告诉我如何在删除.active类

后完全销毁此功能

    function destroy_no_active_class(){
         jQuery('#test.active').mouseover(function (e) {
                e.stopPropagation();e.preventDefault();
                jQuery(this).addClass('highlight');
            }).mouseout(function () {
                jQuery(this).removeClass('highlight');
            }).click(function(e){
                e.stopPropagation();
                e.preventDefault();
                show_data(this);
            });

        });
   }

Answer 1

假设通过'销毁函数'来表示你希望它停止突出显示该元素，只需在处理程序中检查它就可以在处理程序中进行检查，并有条件地执行逻辑。这比取消绑定处理程序更有用，因为如果元素再次变为“活动”，它将自动再次运行。

function destroy_no_active_class(){
    jQuery('#test').on('mouseover.mine mouseout.mine', function (e) {
            if ($(this).is(".active")) {
                e.stopPropagation();
                e.preventDefault();
                jQuery(this).toggleClass('highlight');
            }
        }).on('click.mine', function(e){
            if ($(this).is(".active")) {
                e.stopPropagation();
                e.preventDefault();
                show_data(this);
            }
        });
    });
}

在处理程序中，您也可以执行

if (!$(this).is(".active")) {
    $(this).off('mouseover.mine mouseout.mine click.mine');
}

这里的缺点是，如果元素再次变为活动状态，则必须重新绑定处理程序。（注意$只是jQuery的别名。如果您有命名冲突，只需将jQuery替换为上述代码中的$，就像您一直在做的那样。）

Answer 2

.unbind（）是删除事件行为的正确方法。

您的代码中包含错误。要小心你正在使用的选择器，以及它们是否应该有引号。

if ($('#test').hasClass('active')) {
  $('#test').unbind().removeClass('active');
}

Answer 3

如果我正确理解了这个问题，您希望在完成后删除事件处理程序。

如果是这种情况，您需要

保留对处理程序函数的引用，以便在删除事件处理程序时传递它
使用jQuery's event.namespace capability

从jQuery 1.7开始/关闭是添加事件处理程序的首选方法：

function myhandler(e) {…}

$('#test').on('click', myhandler);
$('#test').off('click', myhandler);

jQuery - 如果没有销毁函数，检查类是否存在

3 个答案: