javascript防止textarea中的特殊字符

Question

我需要限制textarea中以下特殊字符<>{}的使用。 我正在使用这个用于jQuery的字母数字插件（ https://github.com/KevinSheedy/jquery.alphanum ）。

我的脚本如下：

$(document).on('keyup', '#ta_0', function(e){
    blacklisted_characters = $('#ta_0').alphanum({ disallow : '<>{}' }); // Specify characters to disallow
    if (blacklisted_characters) {
        if (!!$.prototype.fancybox)
            $.fancybox.open([
                {
                    type: 'inline',
                    autoScale: true,
                    minHeight: 30,
                    content: '<p class="fancybox-error">' + 'Désolé, l\'utilisation de ce caractère n\'est pas autorisée.' + '</p>'
                }],
                {
                    padding: 0
                });
        else
            alert('Désolé, l\'utilisation de ce caractère n\'est pas autorisée.');
    };

});

如果在文本区域中写入了这些特殊字符，则应出现弹出窗口。 但是我认为我的代码中有一个错误，因为它阻止了我在textarea中添加文本并每次都弹出错误消息。

该插件仅与此兼容：

$('#ta_0').alphanum({ 
    disallow           : '<>{}' 
});

这是如果我做错了的条件。 我的textarea的id是$ta_0 。我只需要设置一个if条件，以便确定是否在textarea <>{}中写入了以下字符。 如果这些字符写在textarea中，它将触发错误弹出窗口。

任何帮助将不胜感激。

谢谢

Answer 1

函数： $('#ta_0').alphanum({ disallow : '<>{}' }); 不返回输入字符作为值，它返回使用jQuery选择器选择的输入数组，在本例中为#ta_0 。 由于这些输入存在于您的页面上，因此它将始终返回true，这将导致弹出窗口继续运行。

您将不得不以几种方式重组代码。

1. 移动$('#ta_0').alphanum({ disallow : '<>{}' }); 按键功能之外
2. 查找列入黑名单的输入的键码（<> {}）
3. 根据这些键码检查keyup函数内部的事件 （在这种情况下为e ），以决定是否显示fancybox。

要澄清第3步：使用keyup似乎很难做到这一点，因为所有字符都需要Shift键作为修饰符。 但是使用keypress ，您会获得Shift + key的唯一代码。

$(document).on("keypress", "#ta_0", function(event) {
  blacklisted_characters = [
    123, // {
    125, // }
    60, // <
    62 // >
  ];
  if (blacklisted_characters.indexOf(event.which) >= 0) {
    alert("Désolé, l\'utilisation de ce caractère n\'est pas autorisée.");
  }
});

我试图将它与alphanum插件结合起来，但是加载github用户内容似乎有问题。 但是在这里您可以看到上面的代码示例

Answer 2

好的，它并不优雅，您必须对其进行一些调整以使其更好，但是它确实满足了您的需求：

$("#myText").on("keyup",function(event){
    //console.log(event.which);
    if(event.which == 219 || event.which == 221 || event.which == 188 || event.which == 190)
        {
            $("#myText").val($("#myText").val().replace(/<|>|{|}/gi,""));
        }
});

希望能帮助到你。