我最近不得不不情愿地禁用在表单元素中粘贴。为此,我编写了 Internet Explorer(和其他人)的 onpaste 事件处理程序的跨浏览器* 实现。我的解决方案必须独立于任何第三方 JavaScript 库。
这是我想出的。它并没有完全禁用粘贴(例如,用户可以一次粘贴一个字符),但它满足了我的需求并且避免了必须处理 keyCodes 等。
// Register onpaste on inputs and textareas in browsers that don't
// natively support it.
(function () {
var onload = window.onload;
window.onload = function () {
if (typeof onload == "function") {
onload.apply(this, arguments);
}
var fields = [];
var inputs = document.getElementsByTagName("input");
var textareas = document.getElementsByTagName("textarea");
for (var i = 0; i < inputs.length; i++) {
fields.push(inputs[i]);
}
for (var i = 0; i < textareas.length; i++) {
fields.push(textareas[i]);
}
for (var i = 0; i < fields.length; i++) {
var field = fields[i];
if (typeof field.onpaste != "function" && !!field.getAttribute("onpaste")) {
field.onpaste = eval("(function () { " + field.getAttribute("onpaste") + " })");
}
if (typeof field.onpaste == "function") {
var oninput = field.oninput;
field.oninput = function () {
if (typeof oninput == "function") {
oninput.apply(this, arguments);
}
if (typeof this.previousValue == "undefined") {
this.previousValue = this.value;
}
var pasted = (Math.abs(this.previousValue.length - this.value.length) > 1 && this.value != "");
if (pasted && !this.onpaste.apply(this, arguments)) {
this.value = this.previousValue;
}
this.previousValue = this.value;
};
if (field.addEventListener) {
field.addEventListener("input", field.oninput, false);
} else if (field.attachEvent) {
field.attachEvent("oninput", field.oninput);
}
}
}
}
})();
要使用它来禁用粘贴:
<input type="text" onpaste="return false;" />
* 我知道 oninput 不是 W3C DOM 规范的一部分,但我测试过这段代码的所有浏览器——Chrome 2、Safari 4、Firefox 3、Opera 10、IE6、IE7——都支持 oninput 或 onpaste。在所有这些浏览器中,只有 Opera 不支持 onpaste,但它确实支持 oninput。
注意:这不适用于使用屏幕键盘的控制台或其他系统(假设在选择每个键时屏幕键盘不会向浏览器发送键)。如果您的页面/应用程序可能被具有屏幕键盘和 Opera 的人使用(例如:Nintendo Wii、某些手机),请不要使用此脚本,除非您已测试以确保屏幕键盘每次选择键后将键发送到浏览器。