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. trycatch.jpg

    JavaScript

    JavaScriptでエラーが起っても固まらないように「try-catch」する

    HTML5とJavaScriptでこねこねしてWebアプリを作って…

  2. oncomplete_function.jpg

    JavaScript

    【TweenMax】「onComplete」で引数を使う方法

    TweenMaxの「onComplete」で引数を使いたい場合って…

  3. about_debug-4.jpg

    JavaScript

    Android端末のデフォルト・ブラウザでJavaScriptのデバッグをする方法

    Webアプリをデザインするときに必須となるのがJavaScript…

  4. style_backgroundImage.jpg

    JavaScript

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

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

  5. tweenmax_js_totation.jpg

    JavaScript

    【TweenMax.js】回転アニメーションも楽々!

    以前も記事に書いたアニメーション用のJavaScriptライブラリ…

  6. 20120826222152

    JavaScript

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

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

最近の記事

  1. 【無印良品】ゴールデンウィーク中のご飯にレトルト買い込み!
  2. 世代ど真ん中だった!!『週刊少年ジャンプ展 vol2』
  3. デジタル通貨を買ってみた記録!とりあえず元は取っている!
  4. 【コレクション】カードダス:SDガンダム外伝シリーズ
  5. 懐かしい!!カードダスSD戦国伝!!
  6. 【無印良品】作り置きに欠かせない!バルブ付き密閉保存容器
  7. 【UNIQLO】冬のジム通いにブロックテックフリースパーカをお得に購入!!
  8. 【UNIQLO】冬のジム通いにブロックテックフリースパンツをお得に購入!!
  9. 【UNIQLO】ユニクロ誕生感謝祭で買いだめ!
  10. 便利すぎる!買ってよかったキッチンツール「キッチンペーパーハンガー」

アーカイブ

  1. 日常

    祭りごとにのってみた
  2. 日常

    (仮)ですが
  3. hayabusa_lego_book_set-1.jpg

    LEGOはやぶさ

    科学少年にオススメのクリスマスプレゼント「レゴはやぶさ + 『はやぶさ、そうまで…
  4. 日常

    数年ぶり
  5. 日常

    また東京で
PAGE TOP