うまくいけば、これは有効な質問です。
textarea 要素の javascript で char カウンターを作成しました。入力で許可されるテキストの量を制限する文字カウンターに相当します。ユーザーが文字を入力すると、文字数が増えて下のボックスに表示されるので、ユーザーはこれまでに何文字書いたかがわかります。
charCode プロパティは、主に Chrome と Opera (Safari ではチェックしていません) のすべてのブラウザーで同じではないため、keydown と keypress の両方で処理しました。charCode が機能しない場合は、keyCode が使用されます。それは問題ではありません。問題は textareaObj.value プロパティにあります。
キーボード ボタンを押すと、最初に古い textareaObj.value 値でキーボード イベントが処理され、次に新しい値が計算されるように見えるので、console.log(textarea.value.length) を出力すると、古いvalue ですが、Firefox と Chrome の Firebug および開発者ツールでは、表示される値は新しい value.length であり、textarea.value.length の真の値です。
よりわかりやすく説明するために、これらのイベントを処理する関数を作成しました。呼び出し関数に console.log(obj.value.length) を入れました。出力は古い値でしたが、firebug (または firefox Web コンソール、または Chrome コンソール) は length プロパティの実際の値を示しています。なぜこれが起こっているのか、誰か説明できますか?
また、textarea オブジェクトには textLength プロパティがあります。textareaObj.value.length と同じ値ですが、アクセスしようとすると未定義です。何故ですか?私は Mozilla Developers ページで textLength を探しましたが、テキストの長さを保持しているだけで、他には何もありません。
助けてくれてありがとう。
編集:
function execute() {
var txtArea = document.getElementById('description');
txtArea.addEventListener('keypress', charCount, false);
txtArea.addEventListener('keydown', charCount, false);
http://jsfiddle.net/WUJvv/1/ _
コードのサンプルは、jsFiddle リンク用です。
ここにあります。これは私のコンピューターでは機能しますが、jsFiddle では機能せず、機能させることができません。謝罪いたします。jsFiddle で行ったのと同じことを行うだけで動作するはずです。
len 変数は、ユーザーが文字を入力したときにインクリメントし、ユーザーが文字を消去したときにデクリメントする必要があります。それは非常にうまく機能しますが、テキストの大部分を強調表示してすべてを一度に消去すると、入力が文字ではなく消去ボタン (keyCode 8) であることがプログラムによって認識されるため、1 ずつ減少します。
18文字の「これは文です」と入力したとしましょう。「文」を強調表示して消去します。これにより、10文字が残りますが、txtArea.value.lengthは17と表示されます。これは、文字ではなく消去ボタン(keyCode 8)である入力を行い、17に減分するだけであるためです。しかし、テキストエリアを表示するとオブジェクトを Firefox Web コンソールで表示すると、textLength プロパティが 10 で、textarea.value が「This is a 」 (「文」部分なし) であることがわかります。textLength プロパティは、テキストの実際の長さを示しますが定義されていないため、この例では非常に役立ちます。
私は専門家ではありませんが、javascript は最初にイベントを処理する関数に入り、次に DOM の内容を調べていると思います。実際にはどうなりますか?