最初にisNaN()とNumber.isNaN()を調べてみました。
コードは「Web制作の現場で使うjQueryデザイン入門[改訂新版]P236」からです。
HTML
1<dt>郵便番号</dt> 2<dd> 3 <input class="validate number" maxlength="4" name="zip1" size="4" type="text">- 4 <input class="validate number" maxlength="3" name="zip2" size="3" type="text"> 5</dd>
jQuery
1//数値のチェック 2if($(this).hasClass("number")) { 3 if(.isNaN($(this).val())){ // 編集前 4 $(this).parent().prepend("<p class='err'>数値のみ入力可能です</p>"); 5 } 6} 7(入力の例1) 82222と333を入力すると、エラーメッセージは表示されず。意図した通りの挙動。 9aaaaとbbbを入力すると、エラーメッセージが表示される。意図した通りの挙動。 10このコードの記法は結果を見る限り有効ですが、 11型変換の有無・戻り値の真偽による作動原理が分かりにくいです。
jQuery
1//数値のチェック 2if($(this).hasClass("number")) { 3 if(Number.isNaN($(this).val())){ // 編集後 4 $(this).parent().prepend("<p class='err'>数値のみ入力可能です</p>"); 5 } 6} 7(入力の例2) 82222と333を入力すると、エラーメッセージは表示されず。意図した通りの挙動。 9aaaaとbbbを入力すると、エラーメッセージは表示されず。意図しない挙動。
以下のサイトで調べてみましたが、内容が難解過ぎてほとんど分かりませんでした。
「isNaN()」は欠陥があるので、使いこなせる自信がありません。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/isNaN
https://js.studio-kingdom.com/javascript/global/is_nan
その他、$.isNumeric()・isFinite()・Number.isFinite()なども試してみましたが、
どれも期待通りには動いてくれませんでした。
正規表現によるコードは今の私には難しすぎて書けません。
とりあえず、.isNaN()をテンプレートのようにとらえて使うのが無難でしょうか。
簡潔かつ堅硬な解決策がございましたら教えて下さい。


回答2件
あなたの回答
tips
プレビュー