当我尝试将JavaScript/jQuery .hover或.click函数绑定到一个:disabled input字段时，没有一个函数被触发。
请参阅下面的片段。
$(document).ready(function() {
var button_1 = $("#button_1");
button_1.hover( function() {
console.log("Hover event button 1");
});
button_1.click( function() {
console.log("Click event button 1");
});
});
function button_2_click() {
console.log("Click even button 3");
}
function button_2_hover() {
console.log("Hover even button 3");
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Hover over one of the buttons, and you'll see none of the console messages gets logged. When removing the `disabled` property, all events are fired.</p>
<button id="button_1" disabled>Disabled 1</button>
<button id="button_2" onmouseover="button_2_hover();" onclick="button_2_click();" disabled>Disabled 2</button>MDN 对该disabled属性的说明如下：
指示元素是否被禁用。如果此属性设置为 true，则该元素将被禁用。禁用的元素通常用灰色文本绘制。如果该元素被禁用，则它不会响应用户操作，无法聚焦，并且不会触发命令事件。
我试图存档的是，当用户:hover超过 时button:disabled，会显示一条消息。
我知道我可以使用 a title="text"。然而，事实并非如此。我在右上角使用一个带有消息的小弹出窗口。该消息存储在一个javascript object.
我的问题：
我该如何解决这个问题？或者只是无法绑定.hover()或onmousemove运行这些disabled input字段？
该click部分符合规格：
禁用的表单控件必须防止
click在用户交互任务源上排队的任何事件在元素上分派。
您正在测试的用户代理似乎更进一步，并且还阻止了与悬停相关的事件（例如，Chrome 和 IE 似乎可以）。其他用户代理可能不会（例如，Firefox 允许与悬停相关的事件。）
如果您想要这些事件，您可以让按钮保持启用状态，然后将它们设置为禁用的样式，并防止单击它们执行其他操作，尽管这可能会导致用户体验混乱。
或者，你可以把一个span 内部的button，并且勾上的事件：
$(document).ready(function() {
var button_1 = $("#button_1 span");
button_1.hover( function() {
console.log("Hover event button 1");
});
button_1.click( function() {
console.log("Click event button 1");
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Hover over one of the buttons, and you'll see none of the console messages gets logged. When removing the `disabled` property, all events are fired.</p>
<button id="button_1" disabled><span>Disabled 1</span></button>按钮的某些部分不会触发事件（环绕声的位），尽管您可以使用 CSS 修复它...
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句