jQuery的不通過.change

Question

火我得到了以下的jQuery代碼：

$('.sub').change(function(event) { 
$.post('get_products.php', $("#products_search").serialize(), 
    function(data) { 
     console.log(data); 
    }, 
    'json' 
); 
}); 

，並有像

<input type="text" name="lkj" id="lkj" class="sub" value="" onfocus="if(this.value == 'Search keyword') {this.value=''}" onblur="if(this.value == ''){this.value ='Search keyword'}" /> 

表單字段是這樣的：

<form action="#" method="POST" name="products_search" id="products_search"> 

的但是，當我更改lkj中的值時，jquery ajax調用不會觸發。

Answer 1

對於type = text輸入字段，不會立即觸發change事件。它在領域失去焦點時被觸發。如果用戶從未在輸入字段外突出或單擊，則更改將永遠不會觸發。

這與複選框和單選按鈕裏面做觸發change事件立即

輸入也必須存在於DOM綁定任何事件偵聽器之前不同。如果它的動態注入，那麼你可以使用

$('body').on('change', '.sub', function() { 
    // your code goes here 
}); 

同時，爲了確保您的代碼被稱爲DOM加載後敷在

$(document).ready(function() { 

}); 

Answer 2

嘗試使用與結合on('change')事件這個例子：

<form action="#" method="POST" name="products_search" id="products_search"> 
    <input type="text" name="lkj" class="sub" placeholder="Search keyword" /> 
</form>​ 
<script type="text/javascript"> 
$(function(){ 
    $('.sub').on('change', function(event){ 
     $.post( 
      'get_products.php', 
      $("#products_search").serialize(), 
      function(data) { 
       console.log(data); 
      }, 
      'json' 
     );   
    });​ 
}); 
</script> 

Answer 3

嘗試用超時KEYUP：

$('.sub').keyup(function(event) { 

    if($(this).timeout) clearTimeout($(this).timeout); 

    $(this).timeout = setTimeout(function(){ 

     alert('posting...'); 

     $.post('get_products.php', $("#products_search").serialize(), 
      function(data) { 
       console.log(data); 
      }, 'json' 
     ); 

    },250); 

}); 

確保您將其包裝在$(function() { ... });