私は簡単なWebアプリケーションを作っています。それの一部で、私は私が私の最新のGoogle Chromeブラウザでコードを実行すると、私はあまりにもテキストを入力することができる午前、とにかく種類の入力ボックス=「数」<input type = "number">のテキスト入力を無効にする>
<input type="number" min="0">
が含まれている:
私はユーザーがそれを行うことを望んでいません。これをどうやって修正すべきですか?
私は簡単なWebアプリケーションを作っています。それの一部で、私は私が私の最新のGoogle Chromeブラウザでコードを実行すると、私はあまりにもテキストを入力することができる午前、とにかく種類の入力ボックス=「数」<input type = "number">のテキスト入力を無効にする>
<input type="number" min="0">
が含まれている:
私はユーザーがそれを行うことを望んでいません。これをどうやって修正すべきですか?
あなただけの特定の文字を許可するように(例えば、jQueryを使って)JavaScriptを使用することができます。
// Catch all events related to changes
$('#textbox').on('change keyup', function() {
// Remove invalid characters
var sanitized = $(this).val().replace(/[^0-9]/g, '');
// Update value
$(this).val(sanitized);
});
Hereはフィドルです。フロートをサポートする
同じこと:
// Catch all events related to changes
$('#textbox').on('change keyup', function() {
// Remove invalid characters
var sanitized = $(this).val().replace(/[^0-9.]/g, '');
// Remove the first point if there is more than one
sanitized = sanitized.replace(/\.(?=.*\.)/, '');
// Update value
$(this).val(sanitized);
});
そしてhereは別のフィドルです。
更新:これが必要ではないかもしれませんが、ここでは、マイナス記号の先頭にできる解決策があります。
// Catch all events related to changes
$('#textbox').on('change keyup', function() {
// Remove invalid characters
var sanitized = $(this).val().replace(/[^-0-9]/g, '');
// Remove non-leading minus signs
sanitized = sanitized.replace(/(.)-+/g, '$1');
// Update value
$(this).val(sanitized);
});
そして(山車と負の数を含む)のみ有効小数可能になりました最終的な解決策:あなたが制限するHTML5 input type numberを使用することができます
// Catch all events related to changes
$('#textbox').on('change keyup', function() {
// Remove invalid characters
var sanitized = $(this).val().replace(/[^-.0-9]/g, '');
// Remove non-leading minus signs
sanitized = sanitized.replace(/(.)-+/g, '$1');
// Remove the first point if there is more than one
sanitized = sanitized.replace(/\.(?=.*\.)/g, '');
// Update value
$(this).val(sanitized);
});
番号にdeciamlポイントがある場合は '.''と..?これは役に立ちません... –
@Mike Answer –
入力にも文字があるので、$(this).val()は ''となります。 –
を番号エントリのみ:
<input type="number" name="someid" />
これはHTML5のクレームブラウザでのみ動作します。
<!DOCTYPE html>
一般的な目的のために、あなたは以下のようにJSの検証を持つことができます:HTMLドキュメントのDOCTYPEがあることを確認し
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
<input type="someid" name="number" onkeypress="return isNumberKey(event)"/>
あなたは小数はこれで「状態ならば」を置き換えるようにしたい場合は、次の
if (charCode > 31 && (charCode != 46 &&(charCode < 48 || charCode > 57)))
私はあなたのソリューションが好きですが、小数点の検証は正しくありません。 '1.2.3.4'は明らかに有効な小数ではありません。ところで、コードスニペットは、 'CTRL + A'や' CTRL + C'などのキーボードショートカットが機能しないようにします。 –
@still_learning 'CTRL + A'と' CTRL + C'はうまく働いていますが、 '1.2.3.4'は有効な小数ではありません。正しいですが、私はこのコードを有効な10進数に書いていないと思います。 ..要件が異なります.... –
が入力をキャッチします何かを削除するにはJavaScriptを追加数字ではありません。 –
@MarcBどうすればいいですか? – coder
これを試してください、http://stackoverflow.com/questions/7295843/allow-only-numbers-to-be-typed-in-a-textbox –