无法让.click()在禁用的textarea上工作

时间:2012-07-29 18:13:18

标签: javascript jquery html textarea

我正在使用jQuery。我有一个残疾的textarea:<textarea id="textarea" disabled="disabled"></textarea>。我想这样做,以便当用户点击textarea时,它会做一些事情,比如警告框。所以,我有$('#textarea').click(function() { alert('Test'); });

但是,这仅在未禁用textarea时有效。那么,即使textarea被禁用,如何才能点击事件?

5 个答案:

答案 0 :(得分:7)

而不是disabled="disabled"为什么不使用readonly,只读与禁用几乎相同,点击事件将有效

答案 1 :(得分:5)

您可以尝试使用CSS模拟禁用的行为,并继续从中接收鼠标事件,而不是禁用它。

或者看到这个答案Event on a disabled input 其中Andy E显示如何在输入顶部放置一个不可见元素(一个叠加层),以便在禁用输入时接收这些鼠标事件。

他删除叠加层并在点击时启用输入,但您可以将行为更改为您喜欢的任何内容。

答案 2 :(得分:2)

禁用的元素不会触发鼠标事件。大多数浏览器会将源自禁用元素的事件传播到DOM树上,因此事件处理程序可以放在容器元素上。但是,Firefox不会出现这种行为,当您单击禁用的元素时,它根本不执行任何操作。

您可以执行以下操作:

$(document).on('click', function(e) { 
    if (e.target.id === 'textarea') alert('works');
});​​​​

FIDDLE

但它可能不是跨浏览器!

另一种可能更好的方法是将另一个元素置于禁用元素之上并捕获该元素上的事件,如:

var t = $("#textarea"),
    over = $('<div</div>');
    over.css({
        position: "absolute",
        top: t.position().top,
        left: t.position().left,
        width: t.outerWidth(),
        height: t.outerHeight(),
        zIndex: 1000,
        backgroundColor: "#fff",
        opacity: 0
    });

t.after(over);

$(over).on('click', function() { 
    alert('works');
});​

FIDDLE

答案 3 :(得分:1)

禁用的元素不会触发点击事件。这是他们被禁用的一部分。

答案 4 :(得分:0)

您无法触发已禁用元素的点击事件,但您可以设置值e-g:

http://jsfiddle.net/j6tdn/28/