防止點選enter回車提交表單

admin發表於2018-08-02

如果form表單獲取焦點的話，點選Enter鍵就能夠提交表單，自然有方便之處，但有時候可能由於錯誤操作導致表單提交。

下面就通過程式碼例項介紹一下如何實現此功能。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.softwhy.com/" />  
<title>螞蟻部落</title>  
<script type="text/javascript">
window.onload=function(){
  var oform=document.getElementById("theform");
  oform.onkeydown=function(ev){
    var ev=window.event||ev;
    if(ev.keyCode==13){
      return false;
    }
  }
}
</script>
</head>  
<body>  
<form id="theform" action="softwhy.com">
<input type="text">
</form>
</body>  
</html>

點選回車不會進行表單提交，原理很簡單，就是首先要判斷點選是否是Enter鍵，如果是Enter鍵，事件處理函式就會返回false，也就是return false語句，這樣就可以取消預設動作，也就不會提交表單。

相關閱讀：

（1）.keydown事件參閱JavaScript keydown 事件一章節。 

（2）.var ev=window.event||ev參閱var ev=window.event||ev一章節。 

（3）.keyCode屬性參閱js的鍵盤按鍵keyCode屬性值對應表一章節。

相關文章