0

私の目的は、単純なHTMLテキストボックス内のユーザー入力(フリーテキスト)を5文字に制限することです。入力フィールドのmaxlengthプロパティを使用してそれを確認していますが、ユーザーが5文字を超えて入力しようとすると、ポップアップを表示する必要があります。

キーダウンイベントを処理しようとしましたが、del、enter、F1..F12、Alt、Page Dnなどを考慮しないために、醜いif-elseを配置する必要があります...これらはすべて許可されているため、ただし、テキストの長さには影響しません。キーコードも1つのシーケンスではありません。キーアップで処理しようとしましたが、その時点ですでに文字が入力されており、余分な文字が消えていくのがわかります。

HTML5以前のソリューション..IE7,8で機能するものは非常に便利です。

4

1 に答える 1

2

maxlengthgecko(例:firefox)では、属性を使用するとブラウザが値が長くなるのを防ぎます。そのため、tooLong検証変数は長くなりますfalseここを参照)。そこに引っ掛かるチャンスはありません。ただし、代わりに-attribute
を使用できます。pattern

<input ... pattern="^.{0,max}$" />

正規表現を最大許容文字数にmax置き換えます。これで、 -eventを バインドし、値が長すぎるかどうかブール値を確認できます。pattern
inputelement.validity.patternMismatch

これが私があなたのために作成した2つの例へのリンクです。それらはFirefoxとChromeの現在のバージョンでテストされていますが、IE9ではテストできません。

  • 最初の例:値が長すぎる場合、値は切り取られ、1秒間エラーメッセージが表示されます。小さな欠点は、ほんの一瞬で入力を確認できることです。
  • 2番目の例では、値が変更されることはなく、文字数が正しくなるまでエラーメッセージが表示され、すべてのフィールドが有効な場合にのみフォームを送信できます。

===更新===

IE7およびIE8のサポートについては、例を更新しました。

于 2012-01-15T13:49:28.817 に答える