您的位置:首页 > 教程笔记 > 前端笔记

阻止点击回车提交表单效果代码实例

2023-12-04 13:39:46 前端笔记 106

本章节介绍一下如何阻止点击回车提交表单效果。

在默认情况下,如果表单或者表单元素获取焦点的话,点击回车就会提交表单。

但是在实际应用中,往往需要只点击提交按钮才能够提交表单。

代码实例:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="/" /> 
<title>实例</title> 
<script>
window.onload=function(){
  var oform=document.getElementById("theform");
  oform.onkeydown=function(ev){
    var ev=ev||window.event;
    var keycode = ev.which || ev.keyCode;
    return keycode == 13 ?false : true;
  }
}
</script> 
</head> 
<body> 
<form name="theform" id="theform" action="">
  <div><input type="text"></div>
  <div><input type="text" ></div>
  <div><input type="text" ></div>
  <div><input type="text" ></div>
  <div><input type="text" ></div>
  <div><input type="submit" value="查看效果"></div>
</form>
</body> 
</html>

上面的代码实现了我们的要求,代码比较简单这里就不多介绍了。

相关推荐