フォームの入力値を検証しようとしています。以下の関数は、入力の値が150未満の数値であると述べ、エラーを表示します。正常に動作します。しかし、私はそれに追加したいと思います。値に数値以外のものが含まれている場合、および/または値が150未満の場合は、エラーを表示します...
どうすれば変更できますか?
if ($('.billboard-height').val() < 150) {
$('.sb-billboardalert').fadeIn(600);
}
フォームの入力値を検証しようとしています。以下の関数は、入力の値が150未満の数値であると述べ、エラーを表示します。正常に動作します。しかし、私はそれに追加したいと思います。値に数値以外のものが含まれている場合、および/または値が150未満の場合は、エラーを表示します...
どうすれば変更できますか?
if ($('.billboard-height').val() < 150) {
$('.sb-billboardalert').fadeIn(600);
}
とにかく、より徹底的な検証はサーバー側で行う必要があるため、期待する値の種類に応じてparseIntまたはparseFloatを使用できます。次に、結果が実際に数値であるかどうか、および制約も満たしているかどうかを確認します。
var number = parseFloat($('.billboard-height').val()); // or parseInt depending on expected input
if (isNaN(number) || number < 150) {
$('.sb-billboardalert').fadeIn(600);
}
編集:
あなたのコメントに基づいて、あなたは正規表現の土地に入っています。私はあなたが自然数だけを望んでいると思います (そして parseInt/parseFloat が px や em などの末尾の非数値文字を無視する方法は問題ありません)。どうですか:
var val = $('.billboard-height').val();
var number = parseInt(val, 10);
if ( ! val.match(/^[0-9]{3,4}$/) || number < 150) {
$('.sb-billboardalert').fadeIn(600);
}
これは 150 から 9999 までの自然数のみを許可する必要があります。
正規表現を使用することをお勧めします:
var intRegex = /^\d+$/;
var floatRegex = /^((\d+(\.\d *)?)|((\d*\.)?\d+))$/;
var str = $('#myTextBox').val();
if(intRegex.test(str) || floatRegex.test(str)) {
alert('I am a number');
...
}
または、@Platinum Azure の提案に従って単一の正規表現を使用します。
var numberRegex = /^[+-]?\d+(\.\d+)?([eE][+-]?\d+)?$/;
var str = $('#myTextBox').val();
if(numberRegex.test(str)) {
alert('I am a number');
...
}
parseInt() の基数パラメーターを忘れないでください。
if (parseInt($('.billboard-height').val(), 10) < 150) {
おそらく正規表現を使用するよりも高速です。正規表現は高速であるとは言えませんが、非常に強力です。このシナリオではやり過ぎかもしれません。
私はこのソリューションを使用していますが、非常にエレガントだと思います-アラートはなく、ユーザーは事実上、数字以外の文字を入力できません。
これは jQuery の例です:
function digitsOnly(){
// extract only numbers from input
var num_val = $('#only_numbers').val().match(/\d+/);
$('#only_numbers').val(num_val);
}
あなたのhtml:
<input type="text" name="only_numbers" id="only_numbers" on oninput="digitsOnly();"/>
浮動小数点数をサポートする必要がある場合は、次を使用して変数が有効かどうかを確認できます。
function isNumber (n) {
return !isNaN(parseFloat(n)) && isFinite(n);
}
var val = $('.billboard-height').val();
if (isNumber(val) && parseFloat(val) < 150) {
$('.sb-billboardalert').fadeIn(600);
}
整数のみをサポートする必要がある場合は、 を使用しますparseInt(n, 10)
。ここで、10 は文字列を変換する基数です。
var val = parseInt($('.billboard-height').val(), 10);
if (val && val < 150) {
$('.sb-billboardalert').fadeIn(600);
}
入力または選択からの値は、javascript の文字列になります。または などparseInt()
の演算子を使用するには、 を使用する必要があります。次のような文字列と比較するために使用する場合に使用できます>
<
==
if ($('.billboard-height').val() == "150")
parseInt関数とisNaN関数を試して、値が数値で より小さいかどうかを確認し150
ます。
var intVal = parseInt($('.billboard-height').val());
if(!isNaN(intVal)){ //not Number
if (parseInt($('.billboard-height').val()) < 150) { //not less than 150
$('.sb-billboardalert').fadeIn(600);
}
}
// Displays an alert if s contains a non-numeric character.
function alertForNonNumeric(s) {
var rgx = /[^0-9]/;
if (s.search(rgx) !== -1) {
alert("Input contains non-numeric characters!");
}
}
注: 負の整数も確認する場合は、正規表現にマイナス記号を追加できます。
function alertForNonNumeric(s) {
var rgx = /[^0-9-]/;
if (s.search(rgx) !== -1) {
alert(s + " contains non-numeric characters!");
}
}