更改焦點後取消onkeypress事件

我的用戶希望此表單可以在按Enter而不是提交表單時將焦點提前到下一個字段。我在測試輸入中添加了onkeypress處理程序，以便在按下Enter時更改焦點。更改焦點後取消onkeypress事件

在下面的代碼中，當keydown函數改變焦點時，我看到光標跳轉到新的文本框，但隨後表單被提交，就像我再次按下回車鍵一樣。我認爲，通過在我的事件處理程序中返回false，事件不會被傳遞，但似乎並非如此。我在Chrome和Firefox中都看到過這種行爲。

有人能告訴我我失蹤了什麼嗎？

<form action="" name="confirmation" method="post"> 
    <fieldset> 
     <div class="clearfix"> 
      <label for="id_event_fuel_amount">Quantity:</label> 

      <div class="input"> 
       <input type="text" id="event_fuel_amount_id" name="event_fuel_amount" onkeypress="keydown(event, &#39;event_purchase_amount_id&#39;)" /> 

      </div> 
     </div> 
     <div class="clearfix"> 
      <label for="id_event_purchase_amount">Sale:</label> 

      <div class="input"> 
       <input type="text" id="event_purchase_amount_id" name="event_purchase_amount" /> 

      </div> 
     </div> 


     <input type="hidden" name="state" value="3" id="id_state" /> 

     <input type="hidden" name="time_stamp" value="2011-09-24 14:34:06" id="id_time_stamp" /> 

     <input type="hidden" name="purchase" value="66" id="id_purchase" /> 


     <input type="submit" value="Save"/> 
    </fieldset> 
</form> 

<script> 
    function keydown(e,s){ 
     if (!e) var e = window.event; 
     if (e.keyCode) code = e.keyCode; 
     else if (e.which) code = e.which; 
     if (code==13){ 
      document.getElementById(s).focus(); 
      return false; 
     } 
    } 
</script>

來源

2011-09-24 dgajohnson

是'onkeypress'屬性真的有必要嗎？以編程方式綁定事件將是一個更好的選擇...（因爲那樣你就不必將'keypress'函數暴露給全局命名空間） –

嘗試

e.preventDefault();

這應該防止事件射擊的形式提交。

來源

2011-09-24 19:02:02

Worked !!!謝謝。 – dgajohnson

我想這可能幫助：

<script type="text/javascript"> 
document.getElementById('hello').onkeydown=function(e){ 
    var e=window.event || e; 
    if (e.keyCode == 13) return false; 
} 
</script> 
<input type="text" id="hello" />

這裏是一個演示：jsFiddle demo

來源

2011-09-24 19:07:59

更改焦點後取消onkeypress事件

回答

相關問題