JavaScriptで値の入力チェックをする【禁止ワード・制限】

2020年6月29日2020年10月28日JavaScript

こんにちは、カミ@god48_です。

Webやアプリで入力フォームやテキストエリアに、ユーザーが入力する場面はよく見ると思います。

実際に皆さんがよく行っているのはECサイトなど様々な通販サイトや会員登録を行うときに、メールアドレスやパスワードなど「入力方法」や「値」が違うなどで入力チェックが行われています。

今回はその入力した値が「禁止ワード」に該当するかチェックを行たいと思います。
JavaScriptで入力チェックをするにあたり、使用するメソッドを紹介しますね。

1. indexOf()メソッドで禁止ワードの検索
2. charAt()メソッドで値を取得
3. JavaScriptで値の入力チェックする【禁止ワード・制限】
4. プログラマー転職、プログラマー副業したい方

indexOf()メソッドで禁止ワードの検索

indexOf()メソッドについて簡単に説明します。

indexOf()メソッドは文字列検索を行い、indexを返します。

値があるときは、「index」を、
値がないときは「-1」を返します。

const str = 'kamiblog'
 
str.indexOf('k'); //0
str.indexOf('a'); //1
str.indexOf('m'); //2
str.indexOf('b'); //-1

charAt()メソッドで値を取得

charAt()メソッドについて簡単に説明します。

charAt()メソッドは文字列の中の「index」の値を返します。

const str = 'kamiblog';
  
str.charAt(0)      // 'k'
str.charAt(1)      // 'a'
str.charAt(2)      // 'm'

スポンサードサーチ

JavaScriptで値の入力チェックする【禁止ワード・制限】

学習したindexOf()メソッドとcharAt()メソッドを使って禁止ワードのチェックを行います。

const str = 値の取得元(フォーム,テキストエリアなど)
const badStr = '禁止ワード'
for (let i = 0; i < str.length; i++) {
  if (badStr.indexOf(str.charAt(i)) !=-1) {
    alert('入力できない文字が含まれています.')

    break;
  }
}