使用javascript或jquery在禁用按钮上执行单击事件

Perform click event on disabled button using javascript or jquery

本文关键字：按钮 执行 单击 事件 javascript jquery 使用      更新时间：2023-09-26

我有一个窗体，我有一个禁用按钮。当用户点击该按钮时，我想显示警告消息。

我的形式代码:-

      <form>
       <input type="button" id="btn" value="Click" disabled>
       </form>
jquery代码:- 
         <script src="path of jquery">
        <script type="text/javascript">
         $(document).on('click',function(e){
         if(e.target.id == "btn" && e.target.disabled){
         alert("The button is clicked.");
         }
          });
        </script>

上面的代码是不工作在任何浏览器除了谷歌chrome。请告诉我怎么做。

Firefox(可能还有其他浏览器)会在禁用的表单字段上禁用DOM事件。任何从禁用表单字段开始的事件都将被完全取消，并且不会向上传播到DOM树。纠正我，如果我错了，但如果你点击禁用按钮，事件的来源是禁用按钮，点击事件被完全清除。浏览器实际上不知道按钮被点击了，也不传递点击事件。这就好像你在点击网页上的黑洞。

在

:

设置日期字段的样式，使其看起来好像已禁用。使用位值创建一个隐藏的"use_date"表单字段，以确定是否在处理期间使用日期字段。为日期字段的onClick添加新功能，将样式类更改为启用状态，并将"use_date"值设置为1。

另一种方式

使用只读而不是禁用

至少对于复选框，这使它们看起来禁用，但行为正常(在Google Chrome上测试)。您必须捕捉点击并适当地阻止事件的默认操作。

您可以在提交按钮周围放置一个div，并在提交按钮被禁用时附加一个click函数:

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

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

浏览器将禁用元素上的事件。如果它在jQuery中工作，则很可能是一个bug。这是从谷歌找到的- http://bugs.jqueryui.com/ticket/5945

但是如果你真的想让用户与禁用按钮交互，最简单的方法是禁用它，而不使用'disabled' html属性。您可以通过多种方式实现，包括:

  1. 用CSS模仿禁用样式(按钮不是真的禁用，只是看起来禁用)
  2. 禁用按钮，但在其上添加叠加并将事件附加到其上

如何显示一个工具提示(标题)来传达你的信息给用户，而不是让他们点击?如:

<form>
    <input type="button" id="btn" value="Click" title="This button is disabled" disabled>
</form>

我认为你不能这样做，但这里有一个变通方法，我希望它对你有帮助。

将按钮放入div中，然后添加函数

<form>
    <div id="btnContainer">
   <input type="button" id="btn" value="Click" disabled>
     </div>
</form>

…

$("#btnContainer").click(function(){
    if($("#btn").is(":disabled")){
       alert("The button is disabled.");
    }
});
http://fiddle.jshell.net/LRP7q/1/

在别的论坛上找到的

Firefox，也许还有其他浏览器，在表单字段上禁用DOM事件那是残疾的。从禁用表单字段开始的任何事件都是完全取消，不会向上传播到DOM树。纠正我如果我错了，但如果你点击禁用按钮，源代码事件是被禁用的按钮，点击事件是完全被禁用的消灭。浏览器根本不知道按钮被点击了，它也不传递click事件。就好像你在点击一个网页上的黑洞

另一个解是you can wrap your disabled element around DIV and listen events on that DIV

例子小提琴

相关文章：