10

単一のフォームフィールドがあり、フィールドがいつ変更されたかを検出し、フィールドの新しい値を使用して追加のコードを実行できるようにする必要があります。押されたキーが実際にテキストボックスの値を変更する場合にのみ、コードを実行したいと思います。これが私が思いついた解決策です。

function onkeypress(e) {
  var value = this.value;
  // do something with 
}

function onkeyup(e) {
  if ( e.which == 8 || e.keyCode == 46 ) { // delete or backspace keys
    this.onkeypress(e);
  }
}

ただし、問題は1つだけです。onkeypressは、フィールドの値が更新される前に起動されるため、値を取得すると、前の値が取得されます。キーが値を変更したかどうかをテストする方法を知っている場合は、キーアップのみを使用しますが、一部の文字（矢印キーなど）はフィールドの値に影響を与えません。

何か案は？

4

6 に答える 6

4

これは簡単です。onkeypressの代わりにonkeyupを使用してください

于 2013-03-03T23:38:03.500 に答える
3

私がこれを行う方法は、単純に。の線に沿った変数を使用することですprevValue。キープレス関数の最後に、その変数に値を格納し、値が前の値と等しくない場合にのみ関数を再実行します。

于 2010-01-19T20:34:59.070 に答える
1

別の条件があります：

if(e.keyCode > 31  && e.keyCode < 127) {
    value = this.value + e;
}

これにより、特別な文字範囲外でキーボードによって入力された低レベルのASCII記号がキャッチされます。

編集：（32はスペースです）

function onkeyup(e) {        
  if ( e.which == 8 || e.keyCode == 46 ) { // delete or backspace keys 
    switch(e.keyCode) {
      case 32:
      case 48..90:
      case 96..111:
      case 188:
      case 190..192: 
      case 219..222:
          value = this.value + e;
          break;
      default: 
          break;
    }       
    this.onkeypress(e);        
  }        
}
于 2010-01-19T20:34:04.487 に答える
1

これが私の最終的な解決策です。これはprevValue変数を使用しますが、グローバル名前空間（ウィンドウ）やdom要素のプロパティを汚染しません。

(function() {
  var input = document.getElementById('input_box'),
      prevValue;

  input.onkeyup = function(e) {
    if ( this.value != prevValue ) {
      prevValue = this.value;
      // execute some more code here...
    }
  }
}());

上記のonkeyup関数は、prevValue変数のクロージャーとして機能することに注意してください。これにより、名前空間の汚染が防止されるため、グローバル変数を作成したり、入力要素自体にプロパティをアタッチしたりする必要がありません。これは私がそれを得ることができるのと同じくらいエレガントです。私は実際にjQueryで書いたのですが、答え自体は純粋なJavaScriptでなければならないと思いました...

于 2010-01-20T15:32:35.477 に答える
0

これは一種のハックですが、前の値をテキストボックスのプロパティ（「拡張属性」と呼ばれます）に入れることができます。

function onkeypress(e) {
  this.oldvalue = this.value;
}

function onkeyup(e) {
  if (this.value != this.oldvalue) {
    // do something
  }
}
于 2010-01-19T20:34:27.433 に答える
0

古い値を保存して、変更されたかどうかを検出できます。

function keyUpHandle(e) {
  if (this.prevValue && this.prevValue != this.value) {
    // do something
  }
  this.prevValue = this.value;
}
于 2010-01-19T20:35:09.850 に答える