javascript - jQuery:使用 off() 禁用 onclick 事件不起作用

Question

这是我想要做的一个简单示例，我有 HTML 代码，我的目标是禁用三个超链接 #validate、#organize和#export:

<p id="menuitems" class="inline textcenter">
                        <a id="import" href="javascript:void(0);" onclick="switchScreen('Import');">IMPORT</a> >> 
                        <a id="validate" href="javascript:void(0);" onclick="switchScreen('Validate');">VALIDATE</a> >> 
                        <a id="organize" href="javascript:void(0);" onclick="switchScreen('Organize');">ORGANIZE</a> >> 
                        <a id="export" href="javascript:void(0);" onclick="switchScreen('Export');">EXPORT</a>
                    </p>

当我尝试调用以下内容时，没有任何反应。我正在使用 jQuery 1.11.4，并且我了解到禁用事件监听器的方法自 1.7 以来已发生变化。所以我想知道下面的 JavaScript 代码是否有错误或有一些新的更改:

$('#validate').off('click');
$('#organize').off('click');
$('#export').off('click');

Answer 1

一种方法是暂时将 onclick 设置为 null，但将原始元素 onclick 存储在元素或 jquery 对象中(例如 data)。使用辅助函数，您可以打开或关闭元素:

function setEnabled($a, Enabled ){
    $a.each(function(i, a){          
        var en = a.onclick !== null;        
        if(en == Enabled)return;
        if(Enabled){
            a.onclick = $(a).data('orgClick');            
        }
        else
        {
            $(a).data('orgClick',a.onclick);
            a.onclick = null;
        }
    });
}

可以用如下方式调用:

setEnabled($('#validate'), false); 

(由于每个元素也适用于具有多个元素的 jquery 对象)

Example fiddle