根据黑名单数组验证输入值

Posted 2023-05-09

【中文标题】根据黑名单数组验证输入值

【英文标题】：Validate input value against blacklist array

【发布时间】：2016-09-01 07:59:06

【问题描述】：

我目前正在使用jQuery Validation，我有一个包含四个输入字段的表单 - 单词、国家/地区、年龄和性别。

国家、年龄和性别验证没有任何问题，但 Word 不想验证 - 我试图让 Word 值在验证之前根据黑名单检查其自身，我试图阻止用户提交冒犯性单词。

目前，无论我在 Word 输入字段中输入什么单词，它总是显示为错误并且不想验证。

如果有人能看出我哪里出错了，我将不胜感激！

Screenshot

JS

 /* Blacklist Array */
    var blacklist = ['foo', 'bar', 'fizz', 'buzz', /* many more banned words... */ ];

    /* Blacklist Validation */
    jQuery.validator.addMethod("word", function(value) 
      var in_array = $.inArray(value, blacklist);
      if (in_array == -1) 
        return false;
       else 
        return true;
      
    );

    /* Submit Validation */
    $("#submit").validate(
      errorPlacement: function(error, element),
      rules: 
        word: 
          required: true
        ,
        country: 
          required: true
        ,
        age: 
          required: true
        ,
        sex: 
          required: true
        
      ,
      submitHandler: function(form) 
        alert('Submitted');
      
    );

html

  <form methord="post" name="wordsubmit" id="submit">
    <div class="inner">
      <input class="word" name="word" placeholder="Your Word" type="text"/>
      <select class="country" name="country" size='1'>
        <option value="">Your country</option>
      </select>
      <select class="age" name="age" size='1'>
        <option value="">Age</option>
        <option value="18-24">18-24</option>
        <option value="25-34">25-34</option>
        <option value="35+">35+</option>
      </select>
      <select class="sex" name="sex" size='1'>
        <option value="">Sex</option>
        <option value="Male">Male</option>
        <option vlaue="Female">Female</option>
      </select>
    </div>
    <input class="submit" name="submit" type="submit" value="Submit"/>
  </form>

【问题讨论】：

所以正是您希望您错误添加的作品必须在文本框中输入时进行验证。不是吗？

你为什么在value上toUpperCase()？ blacklist 中的单词都不是大写的？

是的，所以如果用户输入了一个令人反感的词，该字段将变为无效，如果用户输入了一个无攻击性的词，该字段将变为有效并准备提交。

@Jamiec 输入值是大写的，所以我将数组转换为大写以便值可以匹配？

@Adam - 你没有 - 你将用户输入的值设置为大写，即使黑名单都是小写的。请参阅我的答案以了解更多详细信息。

【参考方案1】：

你添加的word方法中的逻辑是倒退的；如果在数组中找不到输入的单词（即$.inArray 返回-1），那么您希望返回true，因为该单词是有效的。

既然如此，您可以将逻辑简化为：

/* Blacklist Validation */
jQuery.validator.addMethod("word", function(value) 
    return $.inArray(value, blacklist) == -1;
);

Working example

请注意，在示例中我删除了错误消息抑制，以便您可以看到代码正常工作。

还值得确保黑名单数组中的值的大小写一致，因此您可以使用value.toUpperCase() 或value.toLowerCase() 将输入的单词转换为相同的大小写，因为目前FoO 不会' t 匹配 foo 并将被标记为有效。

【讨论】：

感谢你自己@Rory！

这对我不起作用。我没有错误。我不明白为什么不起作用。

@Ionut 你最好开始一个新问题，包括与你自己的情况相关的代码

我们还需要看看您是如何设置 jQuery 验证插件的，确保字段名称匹配等。可能有很多原因导致某些东西对您不起作用

我验证正确，因为所需的验证有效，只有这个自定义验证不起作用。我将验证中的名称放在 addMethod 函数上。当我从小提琴数组输入字符串时，不会触发验证错误。

【参考方案2】：

有几个问题：

您使用toUpperCase()（在您的原始问题中）与只有小写单词的列表进行比较。我想你打算使用toLowerCase()； 你以相反的方式返回false/true。当在黑名单中找不到单词时，您需要返回true（返回值-1） 您根据黑名单检查整个输入，因此一旦输入包含多个单词，验证将永远不会在黑名单中找到它，即使其中一个输入单词可能被列入黑名单。

我建议将您的黑名单转换为正则表达式。这将使您的代码非常简洁：

var blacklist = /\b(foo|bar|fizz|buzz)\b/; /* many more banned words... */

jQuery.validator.addMethod("word", function(value) 
    return !blacklist.test(value.toLowerCase());
);

【参考方案3】：

addMethod 的文档中提到了传入的函数：

实际的方法实现，如果元素有效则返回true。

JQuery 的inArray 方法返回-1 是NOT找到的元素，如果是则返回item的索引。

查看您的方法，如果在您的黑名单中找到元素 IS，它将返回 true - 所以它基本上是错误的方式。

---

此外，正如我评论的那样，您正在对输入的 value 执行 toUpperCase（您随后将其删除） - 但是，如果您希望黑名单检查不区分大小写，您可能需要转换用户输入的值无论您的黑名单有什么大小写 - 所以要么让您的黑名单完全小写并在值上使用toLowerCase()，或者让黑名单全部大写并在值上使用toUpperCase()。

---

这段代码应该可以工作

jQuery.validator.addMethod("word", function(value) 
  var in_array = $.inArray(value.toLowerCase(), blacklist);
  return in_array == -1;
);

【讨论】：

@RoryMcCrossan 是的，是的。