当前位置:  开发笔记 > 编程语言 > 正文

禁止将文本粘贴到HTML表单中

如何解决《禁止将文本粘贴到HTML表单中》经验,为你挑选了9个好方法。

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

例如,我有一个简单的注册表单,用户需要输入两次电子邮件.第二个电子邮件条目是验证第一个电子邮件条目中没有拼写错误.但是,如果用户复制/粘贴他们的电子邮件然后失败了,我一直遇到用户遇到问题,因为他们输入了错误的电子邮件并复制/粘贴了它.

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

也许不是使用这个"黑客",你可以建议另一个解决我正在努力解决的核心问题的解决方案?我做了不到六个用户测试,这已经发生了两次.我的观众没有高水平的计算机熟练程度.



1> Pekka suppor..:

不要这样做.不要弄乱用户的浏览器.通过复制+粘贴到电子邮件确认字段,用户对他们键入的内容承担责任.如果他们愚蠢到复制+粘贴错误的地址(它发生在我身上)那么这就是他们自己的该死的错.

如果您想确保电子邮件确认工作正常,请让用户在您的网站等待时检查他们的电子邮件("请在新窗口中打开您的网络邮件程序").用大胖子信件显示电子邮件地址("确认电子邮件发送给......发了错误?请点击此处更改).

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


还有一种常见的情况是,查看此问题的开发人员很少或根本无法控制他们正在处理的项目的要求.这不是这里提出的问题的答案,所以-1.
如果您有这样的要求,那么作为专业人士的工作就是推迟它.你不仅仅是一双可以编写代码的人.
f*ck要求,争夺权力 - 只有愚蠢的PM和muckety mucks才需要开发人员禁止复制/粘贴
当用户自己输入数据时,我同意您的答案.但是,当用户代表其他人(例如,CRM系统或类似系统)输入电子邮件地址时,实施您的解决方案是不可行的.在这些情况下,用户不是他们输入自己的电子邮件地址,因此他们可能会拼错它.如果您允许粘贴到电子邮件确认框,那么您将获得大量不正确的数据,因此防止粘贴没有任何问题.作为开发人员,您必须减少"愚蠢"用户以保护业务数据.
说不做就不回答这个问题.我目前要求禁用粘贴.

2> Boycs..:

向要禁用复制粘贴功能的输入添加一类'disablecopypaste'并添加此jQuery脚本

  $(document).ready(function () {
    $('input.disablecopypaste').bind('copy paste', function (e) {
       e.preventDefault();
    });
  });



3> Christopher ..:

我最近不得不勉强禁用表单元素中的粘贴.为此,我编写了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);
                }
            }
        }
    }
})();

要使用它来禁用粘贴:



*我知道oninput不是W3C DOM规范的一部分,但是我已经用Chrome-2,Safari 4,Firefox 3,Opera 10,IE6,IE7测试这些代码的所有浏览器都支持oninput或onpaste.在所有这些浏览器中,只有Opera不支持onpaste,但它确实支持oninput.

注意:这不适用于使用屏幕键盘的控制台或其他系统(假设在选择每个键时屏幕键盘不会向浏览器发送键).如果您的页面/应用程序可能被屏幕键盘和Opera(例如:Nintendo Wii,某些手机)使用,请不要使用此脚本,除非您已经过测试以确保屏幕键盘在每个键选择后将密钥发送到浏览器.


要防止firefox遵守这个愚蠢的规则,请转到about:config并将dom.event.clipboardevents.enabled更改为false

4> Kailas..:

刚刚得到这个,我们可以实现它onpaste:"return false",感谢:http://sumtips.com/2011/11/prevent-copy-cut-paste-text-field.html

我们提供了以下列出的各种其他选项.




5> Sheff..:

你可以.....但不要.

您不应该更改用户浏览器的默认行为.您的Web应用程序的可用性确实很差.此外,如果用户想要禁用此hack,那么他们可以在他们的浏览器上禁用javascript.

只需将这些属性添加到文本框即可

ondragstart=”return false” onselectstart=”return false”


问题是关于禁用粘贴.这种技术只会使复制变得困难而根本不会影响粘贴.

6> Josh Lee..:

疯狂的想法:要求用户在注册过程中向您发送电子邮件.当点击mailto链接不起作用时(例如,如果他们使用网络邮件),这显然是不方便的,但我认为这是一种同时保证打字错误并确认电子邮件地址的方法.

它会是这样的:他们填写大部分表格,输入他们的名字,密码等等.当他们推送提交时,他们实际上是在点击链接以向您的服务器发送邮件.您已经保存了其他信息,因此该消息只包含一个令牌,说明了这个帐号.



7> Richard Luca..:

如何将确认电子邮件发送到用户刚刚输入两次的电子邮件地址,其中有一个链接指向您网站上的确认网址,那么您知道他们收到了消息吗?

任何未点击确认收到电子邮件的人可能都输入了错误的电子邮件地址.

不是一个完美的解决方案,而是一些想法.


为了继续科林所说的话,你可以假设当有人试图用相同的用户名和不同的电子邮件地址重新注册并且他们没有回复确认消息时,可能会让他们这样做.您可能会发现人们在他们的电子邮件中获取了他们的域名,但拼错了他们的用户名并可以使用它来进一步确定某人何时犯了错误?
我目前有这个实现.问题是用户认为他们由于我们的错误而没有收到电子邮件,因为他们检查了他们认为*他们输入的电子邮件地址并且他们没有电子邮件.还会发生的是,当他们再次尝试重新注册时,他们使用的用户名现在不可用,因为它使用了错误的电子邮件地址.

8> Sunil Garg..:

你可以使用jquery

HTML文件


jquery代码

$('#email').bind('copy paste', function (e) {
        e.preventDefault();
    });



9> e3matheus..:

扩展@boycs答案,我建议也使用"on".

$('body').on('copy paste', 'input', function (e) { e.preventDefault(); });

推荐阅读
勤奋的瞌睡猪_715
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有