4

我在悬停时有一个禁用的输入字段，我想做一个弹出窗口，说这个字段将被自动填充。

<input type="text" class="dcol" data-toggle="popover" data-content="Required Field with Numeric Input" disabled="disabled" style="background-color:#FFFF66" value="">

这是我的jQuery，它不起作用。

$('input:disabled').hover( 
    function(){
        alert("hello");
    },
    function(){ 
        alert("bye");
    }
 );

谁能建议我如何实现这一目标。

4

5 回答 5

3

鼠标事件不会在禁用字段上触发。您可以做的是将一个元素放在禁用字段的前面，然后将鼠标事件放在该元素上。

这将告诉您确切的操作方法

但是，您可以做的其他事情是保持该字段启用并在悬停时禁用它并显示警报消息。像：

$('input').hover(function(){
  alert("hello");
   $(this).attr('disabled','disabled');        
});

我为它创建了一个小提琴。你可以在这里查看。

于 2013-09-22T08:23:42.220 回答
2

它是由 jQuery 有意完成的。从 jQuery 中查看这个错误

这是基于 #6911 在 jQuery.event.dispatch 中有意完成的，以规范跨浏览器行为。然而，至少对于某些事件，我们这样做似乎是不可取的。我们可以轻松地还原更改，但它会导致其他错误报告。

于 2013-09-22T08:15:17.820 回答
2

您可以将输入框包含在 div 中，并在 div 的 hove 上引发警报。我试过了，效果很好。

<div id="hov"><input type="text" class="dcol" data-toggle="popover" data-content="Required Field with Numeric Input" disabled="disabled" style="background-color:#FFFF66" value=""></div>

$('#hov').hover(function(){
  alert("hello");      
});

我希望这能解决你的问题。

于 2013-09-22T08:43:04.017 回答
0

我通过添加包装器来解决按钮问题，并在包装​​器上添加悬停，然后在禁用时设置图层下方按钮的 z-index。有点痛苦，但似乎效果很好：我对其进行了测试，该解决方案适用于所有其他禁用的表单元素，例如输入/文本区域。

<div class='wrapper-div' onmouseover='function()'>
<button disabled> Having Z-index: -1 </button>
</div>

http://jsfiddle.net/M6xxk/

于 2019-01-16T06:05:18.670 回答
-1

试试这个 //HTLM

<input id="txt" type="text" class="dcol" data-toggle="popover" data-content="Required Field with Numeric Input"  style="background-color:#FFFF66" value="">

//脚本

$("#txt").hover(function(){
alert("this field will be automatically populated!"); 
 $(this).attr('disabled','disabled');

});

小提琴示例

于 2013-09-22T08:27:50.257 回答