web-dev-qa-db-ja.com

<input type = "number" maxlength = "3">がSafariで機能しないのはなぜですか?

最大3文字の入力が必要です。 Firefoxでは、すべて正常に機能しますが、入力内には3つの数字しか書き込むことができませんが、サファリでは、内部に多くの数字を書き込むことができます。

これで両方のブラウザでテストできます: http://flowplayer.org/tools/demos/validator/custom-validators.htm

今のところ私は検証プラグインでそれを実現しました-興味があるだけで、なぜこれが機能しないのか知りたいですか?

編集:

これで動作している

<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>

回答: テキスト要素内の文字を防ぐにはどうすればよいですか?

33
Jules

私はそれを達成しました:

<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>

そして、JavaScriptで私は手紙を禁止しました:

$("#myField").keyup(function() {
    $("#myField").val(this.value.match(/[0-9]*/));
});
31
Jules

以下のように、type = "text"とoninputを使用してみてください。これにより、数字のみが許可されます。

<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>
14
Viktor Karpyuk

基本的にMaxおよびMinプロパティはSafariブラウザーではまだサポートされていません。構文に欠陥はありません。 Safariバージョン1.3以降を使用していますか?それ以下ですか? maxlengthプロパティがサファリ1.3以降でサポートされているため。

4
smhnkmr

私は@Julesの回答に非常によく似たものを使用しましたが、彼はshift + homeのようなキーの使用を許可しません。数値を検証しているため、キーアップ関数でisNaNを使用しました。

$("#myField").keyup(function() {
    var e = $("#myField");
    if(isNaN(e.val())){
        e.val(e.val().match(/[0-9]*/));
    }
});

と...

<input id="#myField" inputmode="numeric" maxlength="3" pattern="([0-9]{3})" type="text" />
1
Travis Peterson

OnKeyDownの長さの使用は制限できます

<input type="number" onKeyDown="if(this.value.length==10 && event.keyCode!=8) return false;">

ハッピーコーディング:)

0
Surya R Praveen

より簡単なソリューションを次に示します。私にとってはうまくいった

<input type="number" id="cvv">


$("#cvv").on("keypress", function(evt) {
  var keycode = evt.charCode || evt.keyCode;
  if (keycode == 46 || this.value.length==3) {
    return false;
  }
});

jSブロックは「。」(ドット)を防ぐため、フロートに入ることはできません。入力タイプを数値として保持しているため、入力としての数値のみになります。値の長さが3の場合、falseを返すため、入力長も制限されます。

0