2

ユーザー検証に HTML5 を使用しています。ここに私のコードのスニペットがあります:

<input type="text" name="name"  id="usernametb" title="Minimum 8 Characters, only letters 
 and numbers" pattern="^[A-Za-z0-9]{8,40}$" placeholder="Enter a Valid UserName" required />

ユーザーが検証パターンと一致しないユーザー名を入力するとすぐに、または次のフィールドにタブで移動したときに、ユーザーにエラー メッセージが表示されるようにしたいと考えています。HTML5でこれを行う簡単な方法はありますか?

現在、[送信] をクリックしてポストバックを強制するまで、エラー メッセージは表示されません。

4

2 に答える 2

0

私は parsley.js ライブラリで良い経験をしました:

http://parsleyjs.org/

また、他の入力タイプ (電話、メール、URL など) についても、html5 はそれ自体で検証できますが、例を修正することはできませんが、適合する場合は非常に強力で非常に軽量なツールです。

例えば：

    <input type="tel" name="cellPhone"></input>

幸運を！

于 2013-07-22T22:15:57.987 に答える
0

これは、jquery の html5 検証プラグインです: http://ericleads.com/h5validate/。

プラグイン サイトからの引用:

jQuery のリアルタイム HTML5 フォーム検証のベスト プラクティス。IE6 などの古いブラウザを含む、すべての一般的なブラウザで動作します。

独自の JavaScript を使用する場合は、次のようなものを使用します。

onkeyup="validateUsername(this)"

…例えば:

<input type="text" name="name"  id="usernametb" title="Minimum 8 Characters, only letters  and numbers" pattern="^[A-Za-z0-9]{8,40}$" placeholder="Enter a Valid UserName" onkeyup="validateUsername(this)" required />

ハッピーコーディング！

于 2013-07-15T21:55:17.407 に答える