1

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

我想检查 class .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);
            });

        });
   }
4

3 回答 3

4

假设“销毁函数”只是意味着您希望它停止突出显示元素,您可以在触发后简单地在处理程序中进行检查,并有条件地执行逻辑。这也比取消绑定处理程序更有用,因为如果元素再次变为“活动”,它将自动再次工作。

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$

于 2013-07-24T04:30:15.037 回答
1

.unbind() 是删除事件行为的正确方法。

您的代码中有错误。请注意您正在使用的选择器,以及它们是否应该有引号。

if ($('#test').hasClass('active')) {
  $('#test').unbind().removeClass('active');
}
于 2013-07-24T04:30:27.647 回答
1

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

如果是这种情况,您将需要

  1. 保留对处理程序函数的引用,以便在删除事件处理程序时可以传递它
  2. 使用jQuery 的 event.namespace 功能

从 jQuery 1.7 开始,on/off 是添加事件处理程序的首选方法:

function myhandler(e) {…}

$('#test').on('click', myhandler);
$('#test').off('click', myhandler);
于 2013-07-24T04:35:56.050 回答