首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >禁用将文本粘贴到HTML表单

禁用将文本粘贴到HTML表单
EN

Stack Overflow用户
提问于 2009-08-04 09:44:51
回答 25查看 250.4K关注 0票数 102

有没有办法使用JavaScript禁用将文本粘贴到HTML表单上的文本字段中的功能?

例如,我有一个简单的注册表,其中用户需要输入他们的电子邮件两次。第二个电子邮件条目用于验证第一个电子邮件条目中是否没有拼写错误。然而,如果用户复制/粘贴他们的电子邮件,那么这就违背了目的,我已经遇到了用户有问题,因为他们输入了错误的电子邮件和复制/粘贴。

也许我的问题不是很清楚,但我并不是想阻止人们在浏览器上复制(或拖动选择)文本。我只是想阻止他们将输入粘贴到文本字段中,以最大限度地减少用户错误。

也许你可以为我在这里试图解决的核心问题提出另一个解决方案,而不是使用这个"hack“?我做了不到半打的用户测试,这种情况已经发生了两次。我的听众的计算机水平不是很高。

EN

回答 25

Stack Overflow用户

回答已采纳

发布于 2009-11-13 01:12:08

我最近不得不勉强禁用表单元素中的粘贴。为此,我编写了Internet Explorer(和其他浏览器)的onpaste事件处理程序的跨浏览器*实现。我的解决方案必须独立于任何第三方JavaScript库。

这是我想出来的。它不会完全禁用粘贴(例如,用户可以一次粘贴一个字符),但它满足了我的需求,并避免了处理keyCodes等问题。

代码语言:javascript
复制
// 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);
                }
            }
        }
    }
})();

要使用此选项以禁用粘贴,请执行以下操作:

代码语言:javascript
复制
<input type="text" onpaste="return false;" />

*我知道oninput不是W3C DOM规范的一部分,但我测试过的所有浏览器-Chrome2、Safari4、Firefox3、Opera10、IE6、IE7-都支持oninput或onpaste。在所有这些浏览器中,只有Opera不支持onpaste,但它确实支持oninput。

注意:这在使用屏幕键盘的控制台或其他系统上不起作用(假设屏幕上的键盘在选择每个键时不会向浏览器发送键)。如果您的页面/应用程序可能被具有屏幕键盘和Opera的人使用(例如:任天堂Wii,一些手机),请不要使用此脚本,除非您已经测试以确保屏幕键盘在每次按键选择后都会将按键发送到浏览器。

票数 58
EN

Stack Overflow用户

发布于 2009-11-13 05:20:56

不要这样做。不要弄乱用户的浏览器。通过复制并粘贴到E-Mail确认字段,用户接受对他们键入的内容的责任。如果他们愚蠢到复制+粘贴错误的地址(这就发生在我身上),那就是他们自己的错。

如果您希望确保电子邮件确认有效,请在您的站点等待时让用户检查他们的电子邮件(“请在新窗口中打开您的new邮件程序”)。以大写字母显示电子邮件地址(“确认电子邮件已发送至……出错?单击此处CLick更改)。”

更好的是,如果可以的话,让用户在没有确认的情况下拥有某种有限的访问权限。这样,他们可以直接登录,您可以提高与访问者保持联系的机会,即使确认邮件由于其他原因(例如垃圾邮件过滤器)而被阻止。

票数 149
EN

Stack Overflow用户

发布于 2012-01-10 09:17:20

向要禁用其复制粘贴功能的输入中添加“disablecopypaste”类,然后添加此jQuery脚本

代码语言:javascript
复制
  $(document).ready(function () {
    $('input.disablecopypaste').bind('copy paste', function (e) {
       e.preventDefault();
    });
  });
票数 73
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/1226574

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档