条件禁用/重新启用jQuery单击事件

我在链接上禁用和重新启用点击事件时出现问题。

设置是连续4列，每列包含链接和隐藏内容框。 单击链接时，它会展开行并显示特定于该列的内容框。 单击链接并展开行后，所有其他链接将逐渐淡出。 然后，您将重新单击打开的链接以关闭该行并取消淡化其他链接。

我已经设置了这个场景的工作小提琴，应该有助于解释它……

http://jsfiddle.net/r8K78/2/

$('.open-box').click(function(event) { event.preventDefault(); var $list_row = $(this).parents('.row'), $column_box = $(this).parent('.column').find('.box'); if ( $(this).is('.open') ) { $(this).removeClass('open'); $list_row.stop().animate({ 'padding-bottom': 0 }, 100).removeClass('expanded'); // hide the content box $column_box.hide(); // find all links and fade them in $('.box-list').find('.box-link').fadeTo(100, 1).addClass('open-box'); } else { $(this).addClass('open'); $list_row.stop().animate({ 'padding-bottom': 200 }, 100, function() { // show the content box $column_box.fadeIn(100); }).addClass('expanded'); // find all links and fade them out $('.box-list').find('.box-link').not(this).fadeTo(100, 0.25).removeClass('open-box'); } }); 

我要做的是禁用所有淡出链接上的click事件，将打开的链接保留为唯一可点击的链接。 正如您所看到的，单击淡出链接的行为会使整个过程变得臃肿。

我已经尝试在open动作（else .off('click')上设置.off('click') ，它可以禁用其他链接上的点击。 并将.on('click')放在关闭动作上。 关闭操作运行后，其他链接仍然无法单击。

任何有关解决这个问题的帮助都将非常感激！

Answer 1

你可以检查不透明度：

 if ($(this).css('opacity') < 1) return; 

看到

但更好的方法是在淡化元素上设置一个类，然后检查这个类，使代码更具可读性/可维护性。

DEMO