Wykryj zmienione pole tekstowe

Przejrzałem wiele innych pytań i znalazłem bardzo proste odpowiedzi, w tym poniższy kod. Chcę po prostu wykryć, gdy ktoś zmieni zawartość pola tekstowego, ale z jakiegoś powodu nie działa ... Nie dostaję błędów konsoli. Kiedy ustawiam punkt przerwania w przeglądarce na change()funkcję, nigdy go nie trafia.

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

<input id="inputDatabaseName">

Możesz użyć inputzdarzenia JavaScript w jQuery w następujący sposób:

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

W czystym JavaScript:

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

Lub tak:

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

spróbuj klucza zamiast zmiany.

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

Oto oficjalna dokumentacja jQuery dla .keyup () .

W każdej odpowiedzi brakuje niektórych punktów, więc oto moje rozwiązanie:

$("#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>

Te Input Eventpożary na klawiaturze wejścia, Mysz Drag , Autofill i kopiuj-wklej testowany na Chrome i Firefox. Sprawdzanie poprzedniej wartości powoduje, że wykrywa ona rzeczywiste zmiany, co oznacza brak strzelania podczas wklejania tej samej rzeczy lub pisania tego samego znaku itp.

Przykład roboczy: http://jsfiddle.net/g6pcp/473/

aktualizacja:

A jeśli chcesz uruchamiać swój komputer change function tylko wtedy, gdy użytkownik skończy pisać i nie uruchomi kilkakrotnie akcji zmiany, możesz spróbować:

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">

Jeśli użytkownik zacznie pisać (np. „Foobar”), ten kod uniemożliwia change actionuruchamianie każdego rodzaju liter użytkownika i działa tylko wtedy, gdy użytkownik przestaje pisać, jest to szczególnie przydatne, gdy wysyłasz dane wejściowe do serwera (np. Dane wejściowe wyszukiwania), które serwer sposób robi tylko jeden poszukiwania foobar, a nie sześć wyszukuje fi wtedy foi wtedy foo, a foobi tak dalej.

Wprowadzanie tekstu nie uruchamia changezdarzenia, dopóki nie straci ostrości. Kliknij poza wejściem, a pojawi się alert.

Jeśli oddzwanianie powinno zostać uruchomione, zanim wprowadzanie tekstu przestanie być aktywne, użyj .keyup()zdarzenia.

onkeyup, onpaste, onchange, oninputwydaje się nie działać, gdy przeglądarka wykonuje automatyczne wypełnianie pól tekstowych. Aby poradzić sobie z takim przypadkiem, autocomplete='off'w polu tekstowym wpisz „ ”, aby uniemożliwić przeglądarce automatyczne wypełnianie pola tekstowego,

Na przykład,

<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>

W moim przypadku miałem pole tekstowe dołączone do narzędzia do wyboru daty. Jedynym rozwiązaniem, które działało dla mnie, było obsłużenie go w zdarzeniu onSelect datepicker.

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

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

Myślę, że możesz keydownteż użyć :

$('#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;
  }
});

PRACUJĄCY:

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