Question

我想确保用户不能使用（。|“）来粘贴字符串，我该如何预防？我正在研究键盘键，它在用户输入时有用。但是我如何防止粘贴？

这里是jsfiddle Testing here

这是我的java脚本

$("[name='search']").on({
keydown: function(e) {
    if (e.which === 32 || e.which === 220) {
        e.preventDefault();
        var v = this.value,
            s = this.selectionStart;
        this.value = v.substr(0, s) + '' + v.substr(s, v.length);
    }
     if (e.which === 55) {
        e.preventDefault();
        var v = this.value,
            s = this.selectionStart;
        this.value = v.substr(0, s) + '7' + v.substr(s, v.length);
    }
},


// Here is the paste function but i no sure how to write it

paste: function(e) {
    var s = this;
    setTimeout(function() {
        // here i no sure how to do it
    });
   }
});

Answer 1

强制性说明：您似乎正在尝试进行客户端验证。在我回答之前，我会指出客户端验证不是非常可靠 - 尤其是在涉及安全性时 - 因为任何了解js控制台的人都可以打败它。有关详情，请参阅问题why is client-side validation not enough?。如果你想防止输入不正确的字符，你必须在服务器端进行。

话虽这么说，检查客户端是很方便的，可以节省用户一些时间。最可靠的方法是使用test()和简单的regular expression。然后，您可以使用带有test条件的if来使用replace()删除有问题的值。

再加上原始代码，它看起来有点像这样：

function check(e){
    var expression = new RegExp(/[\.\|]/, "g");
    if (expression.test(e.target.value)){
        e.target.value = e.target.value.replace(expression, "")
    }
}

您可以在$("[name='search']").on({部分的适当位置调用该功能。另请注意，您的表达式可以是任何正则表达式，允许您检查任何字符或组合字符。 Regex is power

你可以把第2-5行放到粘贴上调用的函数中，但是在Safari和Chrome中测试了它，看起来最好的选择可能是在两者之后调用check()函数。粘贴或模糊事件。这是因为粘贴到输入中并不总是触发更改事件。 .on()的jQuery文档中有一些细节，尽管试错也很棒。

把所有这些放在一起，我得到了以下内容：

function check(e){
    var expression = new RegExp(/[\.\|]/, "g");
    if (expression.test(e.target.value)){
        e.target.value = e.target.value.replace(expression, "")
    }
}

$("[name='search']").on({
    keydown: function(e) {...},
    paste: function(e){
        check(e)
    },
    blur: function(e){
        check(e)
    }
});

希望这有帮助！

改进提示：我个人会更多地努力使代码更可靠和富有表现力，清理一下，并且可能会重新考虑我的方法。仅限初学者：

考虑抛出错误并从输入框中删除所有内容，而不是仅删除有问题的字符“。|” - 在不发出警告的情况下更改用户的输入通常是一个不好的举动。通常最好只删除所有内容。
删除阻止某些字符输入的部分。再一次：掌握JS控制台知识的人可以在心跳中解决这个问题，而你只是通过检查每次按键来增加开销。这不是一个大问题，但可以改进。
使用switch case语句将所有检查逻辑放在一个位置并为所有适当的事件运行它。你必须对jQuery事件监听器有所了解，它可能不值得，但如果我正在编写这段代码，我会调查一下。

Answer 2

您可以使用setTimeout和bind，如下所示，并使用正则表达式删除字符。

$("[name='search']").on({
    keydown: function(e) {
        if (e.which === 32 || e.which === 220) {
            e.preventDefault();
            var v = this.value,
                s = this.selectionStart;
            this.value = v.substr(0, s) + '' + v.substr(s, v.length);
        }
         if (e.which === 55) {
            e.preventDefault();
            var v = this.value,
                s = this.selectionStart;
            this.value = v.substr(0, s) + '7' + v.substr(s, v.length);
        }
    },
    
    paste: function(e) {
        var stopPaste = function(){
           this.value = this.value.replace(/[|\s]/g, '');
        };
                        
        setTimeout(stopPaste.bind(this), 1);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><span>Search: </span><input type="text" name="search" size="75" /></div>

JQuery onpaste事件限制用户粘贴像|的字符，。 /

2 个答案: