2

下面的代码我用来创建一个滑动菜单。我需要知道如何取消绑定附加到点击事件的函数并在其他时间重新附加它。（使用 jQuery 1.7.2）

$(document).ready(function(){
    $('.section').hide();
    $('.header').click(function(){
      if($(this).next('.section').is(':visible'))
      {
        $('.section:visible').slideUp()              
        $('.arrows:visible').attr("src","right.gif")
      }
      else
      {
        $('.section').slideUp();
        $(this).next('.section').slideToggle();
        $(this).find('.arrows').attr("src","down.gif")
    });
});

下面的代码是我到目前为止所拥有的

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
     $('.header').unbind('click');
   }
   else
   {
     //else re-attach functionality?
   }
});

谢谢

4

7 回答 7

7

只需创建一个命名函数。您可以在这里使用低技术并返回基础以取消绑定和重新附加特定事件。

function doStuff()
{
    if($(this).,next('.section').is(':visible'))
        ...
}

$('.header').on('click', doStuff);
$('.header').off('click', doStuff);
于 2012-04-27T14:55:05.323 回答
2

.header我建议您添加一个简单的类并检查单击处理程序中的类，而不是取消绑定和重新绑定。见下文，

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
     $('.header').addClass('dontClick');
   } else  {
     $('.header').removeClass('dontClick');
   }
});

在您的.header点击处理程序中，

$('.header').click(function(){
     if ($(this).hasClass('dontClick')) {
        return false;
     }
     //rest of your code

如果您坚持取消绑定和绑定，那么您可以将处理程序移动到一个函数并多次取消绑定/绑定该函数..

于 2012-04-27T14:54:36.877 回答
1

你可以尝试这样的事情。

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
       $('.header').addClass('clickDisabled');
   }
   else
   {
       $('.header').removeClass('clickDisabled');
   }
});

然后在单击处理程序中检查此类。

$(document).ready(function(){
    $('.section').hide();
    $('.header').click(function(){
        if(!$(this).hasClass('clickDisabled')){
            ...
            ...
        }
    });
});
于 2012-04-27T14:56:48.513 回答
0

为什么不将顶部部分设为函数，然后在 else 语句中调用它呢？

于 2012-04-27T14:55:30.287 回答
0

您可以尝试将变量设置为标志。var canClick = ($('#formVersion').val() != 'Print');然后在您的.header元素的点击处理程序中，在执行您的代码之前检查是否canClick为真。

如果您仍想删除处理程序，您可以将事件对象分配给变量。var eventObj = #('.header').data('events');这将为您提供一个对象，其中包含分配给该对象的所有处理程序。要重新分配点击事件，就像$('.header').bind('click', eventObj.click[0]);

于 2012-04-27T14:57:11.773 回答
0

在用 bind、unbind、on、off、click、attr、removeAttr、prop 努力尝试之后，我让它工作了。所以，我有以下情况：在我的 html 中，我没有附加任何内联 onclick 处理程序。

然后在我的 Javascript 中，我使用以下内容添加了一个内联 onclick 处理程序：

$(element).attr('onclick','myFunction()');

为了稍后从 Javascript 中删除它，我使用了以下内容：

$(element).prop('onclick',null);

这就是我在 Javascript 中动态地绑定和取消绑定点击事件的方式。请记住不要在您的元素中插入任何内联 onclick 处理程序。

于 2013-08-15T12:26:32.717 回答
-2

您可以将所有代码放在.click一个单独的函数中

function headerClick(){
  if($(this).next('.section').is(':visible'))
  {
    $('.section:visible').slideUp()              
    $('.arrows:visible').attr("src","right.gif")
  }
  else
  {
    $('.section').slideUp();
    $(this).next('.section').slideToggle();
    $(this).find('.arrows').attr("src","down.gif")
  }
}

然后像这样绑定它：

$(document).ready(function(){
    $('.section').hide();
    $('.header').click(headerClick);
});

$('#printVers').click(function(){
   if($('#formVersion').val() != "Print")
   {
       $('.header').unbind('click');
   }
   else
   {
       $('.header').click(headerClick);
   }
});
于 2012-04-27T14:55:46.687 回答