点击禁用输入或按钮(Clicking a disabled input or button)

2019-08-31 14:18发布

是否有可能点击被禁用按钮,并提供一些反馈给用户?

HTML:

<input type="button" value="click" disabled>

和JavaScript:

$('input').mousedown(function(event) {
    alert('CLICKED');
});

上面的代码是不是为我工作; 也不是这样的:

$('input').live('click', function () {
    alert('CLICKED');
});

Answer 1:

有没有办法来捕获禁用的元素点击。 最好的办法是对特定反应class的元素。

HTML标记:

<input type="button" class="disabled" value="click" />

JavaScript代码:

$('input').click(function (event) {
    if ($(this).hasClass('disabled')) {
        alert('CLICKED, BUT DISABLED!!');
    } else {
        alert('Not disabled. =)');
    }
});

然后,您可以使用CSS样式来模拟残疾人看看:

.disabled
{
    background-color: #DDD;
    color: #999;
}

这里有一个的jsfiddle展示其使用。



Answer 2:

使得现场readonly可以提供帮助,因为click事件将被解雇。 虽然意识到的行为差异 。

<input type="button" value="click" readonly="readonly" />


Answer 3:

你不能没有一种解决方法,请参见: jQuery的检测点击禁用提交按钮

该浏览器禁用禁用的元素的事件。

编辑从链接添加背景:

提问者发现了这个帖子为什么事件没有登记的说明: http://www.webdeveloper.com/forum/showthread.php?t=186057

火狐,也许还有其他的浏览器,禁用被禁用的表单字段DOM事件。 开始于禁用表单字段的任何事件被完全取消,并且不会传播了DOM树。 纠正我,如果我错了,但如果你点击禁用的按钮,该事件源是禁用按钮,单击事件被完全消灭。 该浏览器从字面上并不知道该按钮点击得到,也没有通上单击事件。 这是因为如果你在点击网页上的黑洞。

解决方法将是风格的按钮,“看”关闭,而实际上并不如此。



Answer 4:

input[disabled] {pointer-events:none}

在你的CSS(它可以防止某些浏览器从丢弃在完全禁用输入点击),并捕获父元素上的点击。 这是一个清晰的解决方案,恕我直言,不是把透明覆盖在元素捕获点击,并视乎情况也可能不是简单地“模拟”使用CSS(因为这不会阻止输入禁用状态更容易提交,也需要覆盖默认浏览器“禁用”的风格)。

如果你有多个这样的按钮,你需要为每一个独特的父母,为了能够区分哪个按钮被点击,因为pointer-events:none ,点击目标是按钮的父,而不是按钮本身。 (或者你可以测试点击坐标,我想...)。

如果您需要支持旧的浏览器,不过,做检查哪些支持pointer-events : http://caniuse.com/#search=pointer-events



Answer 5:

disabled元素不会允许用户与他们进行互动。

所以说:不,你不能把一个onclickdisabled按钮,并期待它开火。



Answer 6:

<input id="idButton" type="button" value="click" disabled>

$('#idButton').on('click', function() {
    // The button is disabled but this will be executed.
});

上面的例子中使用jQuery适用于需要该事件被捕获禁用的按钮。



Answer 7:

你不能点击禁用按钮,但可以点击链接禁用

 $('.btn').on('click', function(e) { e.preventDefault(); $txt = $('div.text'); if($(this).attr('disabled')){ $txt.html('CLICKED, BUT DISABLED!!'); }else{ $txt.html('Not disabled. =)'); } }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="text">No action</div> <input type="button" href="" class="btn" value="click" /> <input type="button" href="" class="btn" value="click disabled" disabled /> <a href="" class="btn">Click</a> <a href="" class="btn" disabled>Click Disabled</a> 



Answer 8:

怎么样在某些元素包木窗的按钮,此元素上捕获点击呢?

<span id="container">
    <input type="button" value="click" disabled>
</span>

使用Javascript:

$("#container").click(function(){
    alert("Element clicked!");
})


Answer 9:

你应该使用禁用=“禁用”,而不仅仅是禁用。

$('input:disabled').val('disabled');


文章来源: Clicking a disabled input or button