모든 키 누르기마다 양식을 제출하는 중

Question

화폐 계산기로 통화 변환이 필요한 버튼이 있습니다. 나는 그것을 변환 (양식을 실행하는) 있도록 입력하고 싶습니다. 현재, 단추 클릭을 처리하는 내 jQuery 다음과 같습니다 (이것은 두 클릭 처리기 중 하나입니다) :

 $('#convertFromButton').click(function() { 
      $("#currencySelectValue2").val($("#currencySelect").val()); 
      $("#btcValueForm").val($("#btcValue").val()); 
      $.post("php/convertFromForm.php", $("#convertFromForm").serialize(), function(data){ 
       $('#fromCurrencyValue').removeClass('intra-field-label'); 
       $('#fromCurrencyValue').val(data); 
      }); 
     }); 

첫 번째 텍스트 필드는 #fromCurrencyValue이고 두 번째 텍스트 필드는 #btcValue입니다.

설명 된 방식대로 작동하려면 어떻게해야합니까?

Answer 1

그때 나는 경우

$('#formCurrencyValue, #btcValue').keyup(function() {$('#convertFromButton').click(); }); 

할 것을 얻을

var xhr; // make it global 

/* 
    Your code goes here 
*/ 
if (xhr) 
    xhr.abort(); // if there's a xhr request abort it 

xhr = $.post(...) 
/* 
    The rest of your code 
*/ 

을 당신은 당신의 제출 로직을 변경합니다. 모든 이벤트에 대해 ge

키 업으로 전환했습니다. 이 키는 누를 때마다 등록해야합니다.

Answer 2

// if you keyup in fromCurrencyValue or btcValue it will trigger the click on convertFromButton 
$("#fromCurrencyValue, #btcValue").bind("keyup", function() { 
    $('#convertFromButton').click(); 
}); 

그러나 $ .post가 기본 비동기로 떨어져 있음을 유의하십시오, 그래서 나중에 물었다 하나 개의 요청이 대답은 다른 이전 인 경우에, 당신은 원치 않는 행동을해야합니다.

편집

값의 사용이 게시 : 그래서 당신은 늘 원치 않는 행동 :

Answer 3

다른 함수/이벤트에서 이벤트 처리기를 명시 적으로 호출하면 은 피해야하는 연습인데, 이는이 아닙니다. 다음을 수행하면 훨씬 더 명확 해집니다.

var xhr; 
    function refresh() { 
     $("#currencySelectValue2").val($("#currencySelect").val()); 
     $("#btcValueForm").val($("#btcValue").val()); 
     if(xhr) xhr.abort(); 
     xhr = $.post("php/convertFromForm.php", $("#convertFromForm").serialize(), function(data){ 
      $('#fromCurrencyValue').removeClass('intra-field-label').val(data); 
     }); 
    } 

    //Bind as many things as you want to your new function. Also easily unit tested! Yay! 
    $('#convertFromButton').click(refresh); 
    $('#fromCurrencyValue, #btcValue').keyup(refresh)