jQuery 捕捉粘贴输入
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/686995/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Catch paste input
提问by Christoffer Winterkvist
I'm looking for a way to sanitize input that I paste into the browser, is this possible to do with jQuery?
我正在寻找一种方法来清理我粘贴到浏览器中的输入，这可以用 jQuery 做吗？
I've managed to come up with this so far:
到目前为止，我已经设法想出了这个：
$(this).live(pasteEventName, function(e) {
// this is where i would like to sanitize my input
return false;
}
Unfortunately my development has come to a screeching hold because of this "minor" issue. I would really make me a happy camper if someone could point me to the right direction.
不幸的是，由于这个“小”问题，我的开发陷入了困境。如果有人能指出我正确的方向，我真的会让我成为一个快乐的露营者。
采纳答案by Christoffer Winterkvist
I sort of fixed it by using the following code:
我使用以下代码修复了它：
$("#editor").live('input paste',function(e){
if(e.target.id == 'editor') {
$('<textarea></textarea>').attr('id', 'paste').appendTo('#editMode');
$("#paste").focus();
setTimeout($(this).paste, 250);
}
});
Now I just need to store the caret location and append to that position then I'm all set... I think :)
现在我只需要存储插入符号的位置并附加到那个位置然后我就准备好了......我想:)
回答by Evgeni Dimov
OK, just bumped into the same issue.. I went around the long way
好的，刚遇到同样的问题..我走了很长一段路
$('input').on('paste', function () {
var element = this;
setTimeout(function () {
var text = $(element).val();
// do something with text
}, 100);
});
Just a small timeout till .val() func can get populated.
只是一个小的超时，直到 .val() func 可以被填充。
E.
E.
回答by Charles Haro
回答by Xue Liangliang
For cross platform compatibility, it should handle oninput and onpropertychange events:
为了跨平台兼容性，它应该处理 oninput 和 onpropertychange 事件：
$ (something).bind ("input propertychange", function (e) {
// check for paste as in example above and
// do something
})
回答by moff
回答by Eric
Listen for the paste event and set a keyup event listener. On keyup, capture the value and remove the keyup event listener.
监听 paste 事件并设置一个 keyup 事件监听器。在 keyup 上，捕获值并删除 keyup 事件侦听器。
$('.inputTextArea').bind('paste', function (e){
$(e.target).keyup(getInput);
});
function getInput(e){
var inputText = $(e.target).val();
$(e.target).unbind('keyup');
}
回答by Rajat Jain
$("#textboxid").on('input propertychange', function () {
//perform operation
});
It will work fine.
它会正常工作。
回答by Abhiram
$('').bind('input propertychange', function() {....});
This will work for mouse paste event.
这将适用于鼠标粘贴事件。
回答by Mister Lucky
This is getting closer to what you might want.
这越来越接近你可能想要的了。
function sanitize(s) {
return s.replace(/\bfoo\b/g, "~");
};
$(function() {
$(":text, textarea").bind("input paste", function(e) {
try {
clipboardData.setData("text",
sanitize(clipboardData.getData("text"))
);
} catch (e) {
$(this).val( sanitize( $(this).val() ) );
}
});
});
Please note that when clipboardData object is not found (on browsers other then IE) you are currently getting the element's full value + the clipboard'ed value.
请注意，当找不到 clipboardData 对象时（在 IE 以外的浏览器上），您当前正在获取元素的完整值 + 剪贴板的值。
You can probably do some extra steps to dif the two values, before an input & after the input, if you really are only after what data was truly pasted into the element.
如果您真的只是在将哪些数据真正粘贴到元素之后，您可能可以在输入之前和输入之后执行一些额外的步骤来区分这两个值。
回答by Alo Sarv
How about comparing the original value of the field and the changed value of the field and deducting the difference as the pasted value? This catches the pasted text correctly even if there is existing text in the field.
将字段的原始值与字段的更改值进行比较，减去差值作为粘贴值如何？即使字段中存在文本，这也会正确捕获粘贴的文本。
function text_diff(first, second) {
var start = 0;
while (start < first.length && first[start] == second[start]) {
++start;
}
var end = 0;
while (first.length - end > start && first[first.length - end - 1] == second[second.length - end - 1]) {
++end;
}
end = second.length - end;
return second.substr(start, end - start);
}
$('textarea').bind('paste', function () {
var self = $(this);
var orig = self.val();
setTimeout(function () {
var pasted = text_diff(orig, $(self).val());
console.log(pasted);
});
});
