0 
<input type='text' maxlength='32' onkeypress='previewLength(32)'>

キーを押すたびに 32 を 1 ずつ減らしたい

長さのプレビューにこれを使用しています (最大長は 32 で、キーが押されるたびに 1 ずつ減少し、残りの量がユーザーに表示されます)

<script>
function previewLength (maxLength) {
maxLength = maxLength -= 1;
document.getElementById('CounterLength').innerHTML = maxLength;
}
</script>
4

3 に答える 3

2

キー押下をカウントする代わりに、実際の値の長さを使用します (たとえば、バックスペース キーは長さを増やす代わりに減らします)。

<input type="text" maxlength="32" onkeypress="previewLength(this.maxLength, this.value.length, 'CounterLength');">

<script type="text/javascript">
function previewLength (maxLength, actualLength, id) {
  document.getElementById(id).innerHTML = maxLength - actualLength;
}
</script>

(maxlength と表示要素 ID も関数に送信することで、複数の要素に再利用できます。)

于 2013-08-08T12:49:53.620 に答える
1

いくつかの誤解があります。キーを押した回数ではなく、実際の値を確認する必要があります。例: バックスペースと左矢印もキー押下ですが、値の長さは増加しません。

html:

<input type='text' maxlength='32' onkeypress='previewLength(this, 32)'>
                                                            ^- use `this`

js:

function previewLength (input_element, maxLength) {
    var remain = maxLength - input_element.value.length;
    document.getElementById('CounterLength').innerHTML = remain;
}
于 2013-08-08T12:47:17.927 に答える
0

負の数を表示しないようにチェックを追加し、コントロールの名前を渡すだけです

window.updateCounter = function updateCounter(e, name) {
  var len = e.value.length
  , max = e.maxLength
  , remaining = (max - len) > 0 ? max-len : 0
  document.getElementById(name).innerHTML = remaining
}

マークアップ

<input type='text' maxlength='32' onkeypress='updateCounter(this, "counter")'/>
<span id='counter'>32</span>
于 2013-08-08T13:02:21.673 に答える