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

jquery 아약스 호출하지만 내가 lkj 값을 변경할 때 발생하지 않습니다.

Answer 1

변경 이벤트는 유형 = 텍스트 입력 필드에 대해 즉시 트리거되지 않습니다. 필드가 포커스를 잃을 때 트리거됩니다. 사용자가 탭 아웃하거나 입력 필드 외부를 클릭하지 않으면 변경 사항이 실행되지 않습니다.

이것은 당신이 그것에 모든 이벤트 리스너를 결합 직전

입력도 DOM에 있어야합니다 변경 이벤트를 트리거 할 체크 박스와 라디오 버튼과 다릅니다. 그 동적으로 주입 경우에 당신은 또한

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

를 사용할 수 있으며, DOM은 on('change') 이벤트에 바인딩이 예제를 사용하는

$(document).ready(function() { 

}); 

Answer 2

시도에 랩에게 그것을로드 된 후 호출되는 코드를 확인하기 :

<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() { ... })에 포장하십시오.