7

いくつかの検証コードを書いているときに、jQueryで奇妙なことに出くわしました-私はhtml5の「数値」フィールドを持っています。

<input type="number" class="required numeric" />

私のスクリプトは、クラスをチェックアウトし、必要に応じて検証するページ上のすべてのフィールドを調べます。奇妙なことに、数値フィールドの 1 つに「X」を入力すると、「これは数値でなければなりません」というエラーではなく、「このフィールドに値を入力してください」というエラーが表示されることに気付きました。いくつかの頭を悩ませ、多くのデバッグを行った後、私は jsFiddle をノックアップして私の理論をデモしました。数値フィールドに文字を入力し、jquery から .val() を実行しようとすると、何も返されないようです。フィールドは空でした（Chromeでこれに遭遇しました-すべてのブラウザでこのように機能するかどうかはわかりません）;

http://jsfiddle.net/shawson/SE46L/3/

ここにフィドルがあります-いくつかの数字を入力してから、いくつかの文字を入力して、クレイジーさを確認してください. これが設計によるものかどうかは誰にもわかります。もしそうなら...なぜですか?

4

2 に答える 2

9

これは jQuery の問題ではありません。ネイティブの element.value (たとえば、getElementByID('something').value) を使用すると、同じ結果が得られます。これは、Chrome が入力 type=number を処理する方法の癖であり、type=text と pattern プロパティを使用して回避することを選択できます。

背景については、この古い質問を参照してください。

于 2013-05-07T14:01:09.297 に答える
1

Chrome で同じ問題に遭遇し、非数値の場合、type=number に値を与えません。私が入れた回避策は、単に値をそれ自体の値に設定することでした。そうすれば、そもそも数値以外の値を入力できなくなります。これはハックですが、機能します。

例えば：

$('body').find('input[type="number"]').each(function(k,v) {

    $(this).on('keyup blur', function() {
        $(this).val($(this).val());
    });

});
于 2014-05-02T00:39:34.307 に答える