Question

我想在textarea中粘贴一些文本后立即在textarea中触发事件。当使用Shift + Ins时，我可以这样做;但是，当我选择鼠标右键然后粘贴（从下拉菜单中）时，我无法做到这一点。 Shift + Ins后Keyup触发。在点击鼠标右键后选择粘贴时，其余的都没有触发......我该怎么办？

<textarea name="message"  id="message"></textarea>

$("#message").on('keyup contextmenu', function(event) { 
     alert("ok");
 });

http://jsfiddle.net/f29vuwoL/7/

谢谢

Answer 1

大多数浏览器都支持input事件，无论如何粘贴或添加内容时都会触发该事件：

$("#message").on('keyup contextmenu input', function(event) { 
  alert("ok");
});

Updated Fiddle

请注意，使用input是最常用的方法，当控件无论如何进行输入时触发，因此如果挂钩多个事件（如上所述），您将获得多个调用输入。例如，如果您在支持keyup的浏览器上同时隐藏input和input，则会收到两个电话。用户粘贴的paste和input同样适用于支持这两者的浏览器。

如果您需要支持不具有input或paste的浏览器，我担心不幸的答案是您需要轮询。尽管如此，每隔250毫秒进行一次轮询并不是要求浏览器做那么多工作，你可以通过功能检测它是否有必要：

var message = $("#message");
var events = null;
var previous;
if ('oninput' in message[0]) {
    // Browser supports input event
    events = "input";
} else if ('onpaste' in message[0]) {
    // Browser supports paste event
    events = "paste keyup contextmenu";
}
if (!events) {
    // Ugh, poll and fire our own
    events = "pseudoinput";
    previous = message.val();
    setInterval(function() {
        var current = message.val();
        if (current != previous) {
            previous = current;
            message.trigger(events);
        }
    }, 250);
}
console.log("Using: " + events);
message.on(events, function(e) { 
  console.log("Got event: " + e.type);
});

Updated Fiddle

Answer 2

您可以使用专用的paste活动：

$("#message").on('paste', function(event) { 
     alert("ok");
 });

Updated jsFiddle

但是你可能想检查一下browser support - 我不认为jQuery会使这个事件正常化。

如果您需要IE支持，可能会有点困难，但这取决于您的要求 - 它是否绝对需要paste行动？如果没有，TJ Crowder的答案就是要走的路。

Answer 3

您应该使用input事件回调。请参阅演示here

Answer 4

如果要检测textarea，input：text，input：password或input：search元素的内容何时发生更改，on输入很有用，因为当元素失去焦点时，这些元素的onchange事件会触发，而不是修改后立即。版本9中的Internet Explorer支持oninput事件。

 $("#message").on('input propertychange', function() {
       console.log($(this).val());
    });

Fiddle

单击鼠标右键并粘贴Fire事件

4 个答案: