jQuery - przy zmianie tekstu wejściowego

Question

Próbuję wykonać funkcję, która zostanie wykonana po zmianie wartości text input field. Wartość pola zmienia się po kliknięciu komórki tabeli, a nie na keyup ani wklejeniu. Próbowałem tak:

$("#kat").change(function(){ 
    alert("Hello"); 
}); 

I mam pola tekstowego:

<input type="text" id="kat" value="0"/> 

ale to nie działa. Jakaś pomoc?

Answer 1

To z komentarzem na stronie dokumentacji jQuery:

starszych, wstępnie HTML5 przeglądarek „keyup” jest na pewno to, czego szukasz.

W HTML5 pojawia się nowe zdarzenie "input", które zachowuje się dokładnie tak, jak wydaje się, że "zmiana" powinna była zachowywać się - w tym, że uruchamia się natychmiast po naciśnięciu klawisza w celu wprowadzenia informacji do formularza.

$ ("element"). Bind ("wejście", funkcja);

Answer 2

Dokumentacja jQuery mówi: "Jest również wyświetlana [wynik wykonania obsługi], jeśli zmienisz tekst w polu, a następnie klikniesz .Jeżeli pole traci ostrość bez zmiany zawartości, zdarzenie nie jest wyzwalany. ".

Spróbuj wydarzenia keyUp i keyDown, tak:

$("#kat").keydown(function(){ 
    alert("Hello"); 
}); 

Answer 3

Wydaje mi się aktualizujesz wartość pola tekstowego w javascript. onchange Zdarzenie zostanie wyzwolone tylko wtedy, gdy wprowadzisz dane i tabulator poza polem tekstowym.

Jednym z obejść jest wywołanie zdarzenia zmiany pola tekstowego podczas modyfikowania wartości pola tekstowego ze skryptu. Zobacz poniżej:

$("#kat").change(function(){ 
    alert("Hello"); 
}); 


$('<tab_cell>').click (function() { 
    $('#kat') 
     .val($(this).text()) //updating the value of the textbox 
     .change();   //trigger change event. 
}); 

Answer 4

To działa dla mnie. Może to być problem z przeglądarką, o której wspomniano, a może jQuery nie jest poprawnie rejestrowany, a może prawdziwy problem jest bardziej skomplikowany (że stworzyłeś prostszą wersję, żeby o to zapytać). PS - musiał kliknąć z pola tekstowego, aby go uruchomić.

http://jsfiddle.net/toddhd/Qt7fH/

Answer 5

Ta technika działa dla mnie:

$('#myInputFieldId').bind('input',function(){ 
       alert("Hello"); 
    }); 

Należy zauważyć, że zgodnie z this JQuery doc, "on" jest zalecany zamiast wiążą w nowszych wersjach.

Answer 6

Działa to dla mnie na wszystkich przeglądarkach i Jquery < = v1.10

$('#kat').on('keyup', function() { 
    alert("Hello"); 
}); 

lub jak się wydaje chcesz

$('#kat').on('click', function() { 
    alert("Hello"); 
}); 

pożary Ramka zmiana pola zdarzeń, jak można oczekiwać, że , jQuery.Zmień zdarzenie działa poprawnie tylko na HTML5 obsługiwanych przeglądarek

Answer 7

ten pracował dla mnie

var change_temp = ""; 
$('#url_key').bind('keydown keyup',function(e){ 
    if(e.type == "keydown"){ 
     change_temp = $(this).val(); 
     return; 
    } 
    if($(this).val() != change_temp){ 
     // add the code to on change here 
    } 

}); 

Answer 8

function search() { 
     var query_value = $('input#search').val(); 
     $('b#search-string').html(query_value); 
     if(query_value !== ''){ 
      $.ajax({ 
       type: "POST", 
       url: "search.php", 
       data: { query: query_value }, 
       cache: false, 
       success: function(html){ 
        //alert(html); 
        $("ul#results").html(html); 
       } 
      }); 
     }return false;  
    } 

    $("input#search").live("keyup", function(e) { 
     clearTimeout($.data(this, 'timer')); 

     var search_string = $(this).val(); 

     if (search_string == '') { 
      $("ul#results").fadeOut(); 
      $('h4#results-text').fadeOut(); 
     }else{ 
      $("ul#results").fadeIn(); 
      $('h4#results-text').fadeIn(); 
      $(this).data('timer', setTimeout(search, 100)); 
     }; 
    }); 


and the html 
<input id="search" style="height:36px; font-size:13px;" type="text" class="form-control" placeholder="Enter Mobile Number or Email" value="<?php echo stripcslashes($_REQUEST["string"]); ?>" name="string" /> 
     <h4 id="results-text">Showing results for: <b id="search-string">Array</b></h4> 
     <ul id="results"></ul> 

Answer 9

Spróbuj tego,

$('#kat').on('input',function(e){ 
alert('Hello') 
}); 

Answer 10

Niedawno zastanawiałem się, dlaczego mój kod nie działa, a następnie Zdałem sobie sprawę, muszę ustawić procedury obsługi zdarzeń zaraz po załadowaniu dokumentu, w przeciwnym razie, gdy przeglądarka ładuje linię kodu po linii, ładuje JavaScript, ale nie ma jeszcze elementu, który by przypisać wigilię Do tego nie doszło. z twoim przykładem, powinno być tak:

$(document).ready(function(){ 
    $("#kat").change(function(){ 
     alert("Hello"); 
    }); 
});