jQuery检测点击禁用提交按钮

Question

小提琴:http://jsfiddle.net/ugzux/

正如您所看到的,我有一个带有禁用(通过javascript)提交按钮的表单.

我希望能够将click事件绑定到它,所以我可以在我允许提交表单(即再次启用该按钮)之前对输入需要修复的内容进行一些爵士指示.

但是,禁用提交按钮也显然会禁用绑定到按钮的任何点击事件,即使它们在禁用后被绑定 - 任何想法如何解决这个问题？

实际上,一种解决方案是停止禁用按钮,而是有一个事件

$('form').submit(function(event){
    event.preventDefault(); 
});

但是我想知道禁用输入和javascript事件的来龙去脉,如果有解决方法,因为我之前从未遇到过这种行为.

Answer 1

在这个问题中找到了这个-

Firefox以及其他浏览器可以禁用已禁用的表单字段上的DOM事件.从已禁用的表单字段开始的任何事件都将被完全取消,并且不会在DOM树中向上传播.如果我错了,请纠正我,但如果您单击禁用按钮,则事件源是禁用按钮,并且完全消除了单击事件.浏览器字面上不知道点击的按钮,也没有通过点击事件.就像你点击网页上的黑洞一样.

我认为你可以通过将按钮包装在div中并在div的click事件上触发逻辑来"伪造"一次点击.但是,如上所述,禁用元素上的事件似乎没有冒出DOM树.

Answer 2

我发现这样做的最好方法是使用"禁用"类来禁用按钮.然后,您可以通常在jquery中捕获单击事件.如果$(this).hasClass('disabled'),你做了'爵士指示'的东西,event.preventDefault(); 一旦用户完成了他们的事情,你可以removeClass('disabled')从input[type="submit"]'按钮'.简单!

Answer 3

您可以在提交按钮周围放置一个div,并在禁用提交按钮时附加一个单击功能:

<div id="sub-div"><input type="submit"><div>

$('sub-div').click(function(event){
    if (attr('submit-button', 'disabled') == 'true')
    {
        alert('Button Disabled')
    }
});

这只是我头脑中的代码,所以它可能不完全正确.但你明白了.