禁用按钮仍然使用“.click（）”触发

Question

似乎禁用按钮 “onclick”功能在触发程序时仍然被触发，例如：

<div>
   <input type="button" onclick="save()" id="saveButton"    value="save"  disabled="disabled" />
   <input type="button" onclick="byPassDisabled()" value="bypass disabled button"/>
<div id="counter">0</div>

function save(){
    var count = parseInt($('#counter').html());
    $('#counter').html(++count);
}
function byPassDisabled(){
     $('#saveButton').click();   
}

见http://jsfiddle.net/WzEvs/363/

在我的情况下，键盘快捷键绑定到触发按钮上的“.click（）”的功能。 我发现必须禁用shorcuts或检查按钮是否已被禁用非常烦人。 我更喜欢解决这个问题的一般解决方案。

• 但为什么？ 这种行为对我来说似乎不公平。
• 任何解决方法？

Answer 1

该属性仅禁用用户交互，该按钮仍可通过编程方式使用。

所以是的，你得检查一下

function byPassDisabled(){
    $('#saveButton:enabled').click();   
}

或者，不要使用内联处理程序。

$(document).on('click', '#saveButton:enabled', function(){
    // ...
});

Answer 2

为了将来使用... OP代码可以工作，因为即使DOM元素被禁用，jQuery仍然会调用它自己的处理程序。 如果要使用vanilla javascript，则会禁用disabled属性。

const element = document.getElementById('saveButton');
element.click() //this would not work

Answer 3

您可以通过编程方式触发单击禁用按钮。

有一些方法可以查找事件是否是用户单击按钮，或者是否已通过编程方式触发。 http://jsfiddle.net/WzEvs/373/

$(function () {
    $("#saveButton").on('click', function (e) {
        if (!e.isTrigger) {
            var count = parseInt($('#counter').html());
            $('#counter').html(++count);
        }
    });
    $("#bypassButton").on('click', function (e) {
        $("#saveButton").click();
    });
});

如果以编程方式调用click()则e.isTrigger为true。 基本上你是在代码中手动触发click事件。

Answer 4

你可以触发click静止，虽然它被disable 。正如Spokey说它只是显示用户交互（可用性仍然存在，可以通过编程方式打开）。 off或unbind点击将解决此问题。

谢谢