JavaScript

正規表現で入力されたテキストが有効かをチェックする


テキストボックスに入力されたテキストが
整数かどうかをチェックします。

1
2
3
4
5
6
7
8
9
function checkTxt(event){
    var str = document.getElementById('txt_box').value;
    var regexp = /^-?d+$/;
    var output = document.getElementById('outputMesse');    if(regexp.test(str)){
        output.innerHTML = '';
    } else {
        output.innerHTML = '数値ではありません';
    }
}

2行目でテキストボックスから値を取得。
3行目で正規表現パターンを設定。
5行目で「test」メソッドを利用して、取得したテキストが正規表現パターンに当てはまっているかをチェックします。

基本的には定義する正規表現パターンを変えることで、いろいろ幅広く対応できるというわけ。この正規表現というやつがちょっと難しくてよくわかってませんが、こういうのがあると入力するユーザーは助かりますよね。

例として正規表現パターン部分を以下に。

1
2
3
4
5
//メールアドレスチェック
var regexp = /^[w-.]+@[w-.]+$/;
 
//URLチェック
var regexp = /^http(s)?://([w-]+).([w-.]+)/([w-./#]*)$/

▼基本から勉強するならコレ!

関連記事

  1. JavaScript

    JavaScriptでグローバル変数の使いどころを見直してパフォーマンスを改善する

    JavaScriptのコードの中では、どこにデータを格納するかでコ…

  2. JavaScript

    JavaScriptでコメントは「/* */」をなるべく使わないようにしたい

    コメントには囲った部分をすべてコメントにする「/* */」と、1…

  3. JavaScript

    JavaScriptでテキストボックスから値を取得する

    テキストボックスに入力された値を取得します。Elementオブジ…

  4. JavaScript

    JavaScriptでは「変数のスコープ」を正しく理解してエラーを減らそう!

    変数の「スコープ」は正しく理解しないと、エラーにならないエラーが起…

  5. JavaScript

    背景画像をJavaScriptで入れ替える2種類の方法

    ものごとには「正解」というものがひとつではない、ってことが多いもん…

  6. JavaScript

    配列に入れた無名オブジェクトの値をクリアする

    オブジェクトの値を配列にいれて管理することってけっこうあります。…

最近の記事

  1. ホワイトハウスコックスの財布
  2. 進撃の巨人展FINAL チラシ
  3. 【無印良品】ゴールデンウィーク中のご飯にレトルト買い込み!
  4. 世代ど真ん中だった!!『週刊少年ジャンプ展 vol2』
  5. デジタル通貨を買ってみた記録!とりあえず元は取っている!
  6. 【コレクション】カードダス:SDガンダム外伝シリーズ
  7. 懐かしい!!カードダスSD戦国伝!!

アーカイブ

  1. 展覧会

    ボダスポ再び! ミニフィグビルダーさくれつさんの個展に行ってきた♪
  2. パックマンからマインクラフトまで! 日本初のゲーム展覧会「GAME ON」

    展覧会

    パックマンからマインクラフトまで! 日本初のゲーム展覧会「GAME ON」
  3. これはドーナツではなくてケーキだ!ミスドの「ミスターサマードーナツ」

    グルメ

    これはドーナツではなくてケーキだ!ミスドの「ミスターサマードーナツ」
  4. 日常

    結婚式
  5. Appleイベント

    2013/9/10「This should brighten everyone&…
PAGE TOP