2016-05-22 5 views
1

私は、長さとコンテキストに基づいて、使用できるユーザー名に関してユーザーを幾分制限しようとしています。禁止された単語が入力された場合、どのようにユーザーを赤で捕まえるのですか?

ここでは、ユーザーが現在のテキストボックスを離れるときに禁止された単語が見つかると、ユーザー名ラベルを赤色にしようとしています。

コードは私にとってはうまく見えますが、他の基準が満たされていれば、禁止された単語を完全に無視して、ラベルを緑色にしているようです。私のコードで何が間違っていますか?

var username = document.forms.LogInForm.username; 
username.onblur = function() { 

    var forbiddenWords = ["fff, dddd, aaa, rrrr, oooo"]; 
    var regex; 
    var username_value = this.value.split(''); 

    for (var a = 0; a < forbiddenWords.length; a++) { 
     regex = new RegExp('\\b' + forbiddenWords[a] + '\\b'); 
     if (username_value[username_value.length - 1] === "-" || username_value[username_value.length - 1] === "_") { 
      console.log('Username cannot end in dash (-) or underscore (_). We removed it for you!'); 
      this.value = this.value.slice(0, -1); 
     } 
     else if (this.value.length < 4) { 
      console.log('Username cannot be less than 4 characters'); 
      document.getElementById('username_label').style.color = "red"; 
     } 
     else if (username.value.search(regex) >= 0) { 
      console.log('Username contains swearing word. Please, remove it'); 
      document.getElementById('username_label').style.color = "red"; 
     } 
     else { 
      document.getElementById('username_label').style.color = "green"; 
     } 
    } 
}; 
+0

基本的なロジックの欠陥のように見えますが、インスタンスが最後に失敗してから最後に失敗した場合は追跡できません。スタイルは最後のインスタンスのみに依存します – charlietfl

答えて

1
var forbiddenWords = ["fff, dddd, aaa, rrrr, oooo"]; 

最も可能性の高い間違いであるとあなたが別の文字列の配列ではなく、コンテンツとして、いくつかのカンマとスペースを持っている文字列を含む1つの要素の配列をしたい

var forbiddenWords = ["fff", "dddd", "aaa", "rrrr", "oooo"]; 

をお読みください。

1

おそらく\bを使用しません。 \bを使用すると、ユーザーは誓いの単語を入力してから任意の文字を追加するだけで、正規表現は何も検索されません。

また、最後の禁止された単語が見つからない場合は、else文のために検証の色が合格と表示されます。禁則語だけを別のループにし、値を有効または無効としてマークし、それに基づいて色を表示する必要があります。

関連する問題