変更された入力テキストボックスを検出する

私は他の多くの質問を見て、以下のコードを含む非常に単純な答えを見つけました。誰かがテキストボックスのコンテンツを変更したことを検出したいのですが、なんらかの理由で機能していません...コンソールエラーは発生しません。ブラウザーでchange()関数にブレークポイントを設定すると、ヒットしません。

$('#inputDatabaseName').change(function () { 
    alert('test'); 
});

<input id="inputDatabaseName">

次のようにjQueryでinputJavaScriptイベントを使用できます。

$('#inputDatabaseName').on('input',function(e){
    alert('Changed!')
});

純粋なJavaScript：

document.querySelector("input").addEventListener("change",function () {
  alert("Input Changed");
})

またはこのように：

<input id="inputDatabaseName" onchange="youFunction();"
onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();"/>

変更の代わりにキーアップを試してください。

<script type="text/javascript">
   $(document).ready(function () {
       $('#inputDatabaseName').keyup(function () { alert('test'); });
   });
</script>

これが.keyup（）の公式jQueryドキュメントです。

各回答にはいくつかの点が欠けているので、ここに私の解決策があります：

$("#input").on("input", function(e) {
  var input = $(this);
  var val = input.val();

  if (input.data("lastval") != val) {
    input.data("lastval", val);

    //your change action goes here 
    console.log(val);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">
<p>Try to drag the letters and copy paste</p>

Input Event上の火災キーボード入力、マウスのドラッグ、オートフィルやコピー＆ペースト ChromeとFirefoxの上でテスト。以前の値をチェックすると、実際の変更が検出されます。つまり、同じものを貼り付けたり、同じ文字を入力したりしても、発火しないということです。

作業例：http : //jsfiddle.net/g6pcp/473/

更新：

そしてchange function 、ユーザーが入力を完了したときにのみ実行して、変更アクションが何度も実行されないようにしたい場合は、これを試すことができます：

var timerid;
$("#input").on("input", function(e) {
  var value = $(this).val();
  if ($(this).data("lastval") != value) {

    $(this).data("lastval", value);
    clearTimeout(timerid);

    timerid = setTimeout(function() {
      //your change action goes here 
      console.log(value);
    }, 500);
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">

ユーザーが入力を開始すると（例： "foobar"）、このコードはユーザーが入力change actionするすべての文字に対して実行するのを防ぎ、ユーザーが入力を停止したときにのみ実行されます。これは、サーバーに入力（例：検索入力）を送信するときに特に役立ちます。 wayサーバーはありません一つだけの検索foobarではなく6を検索しf、その後とfo、その後、fooおよびfoob等々を。

テキスト入力は、changeフォーカスを失うまでイベントを発生させません。入力の外側をクリックすると、アラートが表示されます。

テキスト入力がフォーカスを失う前にコールバックが発生する必要がある場合は、.keyup()イベントを使用します。

onkeyup, onpaste, onchange, oninputブラウザがテキストボックスで自動入力を実行すると失敗するようです。このような場合にautocomplete='off'対処するには、テキストフィールドに「」を含めて、ブラウザがテキストボックスを自動入力しないようにします。

例えば、

<input id="inputDatabaseName" autocomplete='off' onchange="check();"
 onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();" />

<script>
     function check(){
          alert("Input box changed");
          // Things to do when the textbox changes
     }
</script>

私の場合、日付ピッカーに接続されたテキストボックスがありました。私にとってうまくいった唯一の解決策は、日付ピッカーのonSelectイベント内でそれを処理することでした。

<input type="text"  id="bookdate">

$("#bookdate").datepicker({            
     onSelect: function (selected) {
         //handle change event here
     }
});

私keydownもあなたが使うことができると思います：

$('#fieldID').on('keydown', function (e) {
  //console.log(e.which);
  if (e.which === 8) {
    //do something when pressing delete
    return true;
  } else {
    //do something else
    return false;
  }
});

ワーキング：

$("#ContentPlaceHolder1_txtNombre").keyup(function () {
    var txt = $(this).val();
        $('.column').each(function () {
            $(this).show();
            if ($(this).text().toUpperCase().indexOf(txt.toUpperCase()) == -1) {
                $(this).hide();
            }
        });
    //}
});