1. ホーム
  2. javascript

[解決済み] 数値入力タイプで非数値を入力できないようにする

2023-07-20 22:25:15

質問

使用方法 <input type=number> を使うと this.value は、入力が有効な数字でない場合、イベントリスナー内の が空の文字列を返すようにします。 この例は、次のサイトで見ることができます。 http://jsfiddle.net/fSy53/

しかし、入力に無効な文字が表示されたままです。

実際にある値を取得する方法はありますか? 表示される の値を取得する方法はありますか?

私の最終的な目標は、ユーザーが実際にフィールドに数字以外の文字を入力するのを防ぐことです。 私は type=number を使用して、モバイルデバイスで数字の仮想キーボードが使用されるようにする必要があります。 私の目標は、次のようなことを行うことです。 this.value = this.value.replace(/[^0-9.]/g, "")keyup keypress から読み出すと、無効な文字が入力された場合、うまくいかないからです。 this.value から読み出すと "" .

どのように解決するのですか?

入力されるキー値が気に入らない場合は、デフォルトの動作を阻止してみてください。

document.querySelector("input").addEventListener("keypress", function (evt) {
    if (evt.which < 48 || evt.which > 57)
    {
        evt.preventDefault();
    }
});