DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JavaScript監聽和禁用浏覽器回車事件實例教程
JavaScript監聽和禁用浏覽器回車事件實例教程
編輯:關於JavaScript     

js監聽浏覽器回車事件,可以支持ie6+,火狐,谷歌等浏覽器。
代碼如下:
<html>
<head>
<script type="text/javascript">
//注冊鍵盤事件
document.onkeydown = function(e) {
 //捕捉回車事件
 var ev = (typeof event!= 'undefined') ? window.event : e;
 if(ev.keyCode == 13) {
  alert('捕捉到了回車事件!');
 }
}
</script>
</head>
<body />
</html>

那麼,如何捕捉指定DOM對象的回車事件?這裡以input標簽為例說明:

代碼如下:
<html>
<head>
<script type="text/javascript">
//注冊鍵盤事件
document.onkeydown = function(e) {
 //捕捉回車事件
 var ev = (typeof event!= 'undefined') ? window.event : e;
 if(ev.keyCode == 13 && document.activeElement.id == "msg") {
  alert("獲取到內容:" + document.activeElement.value);
 }
}
</script>
</head>
<body>
<input type="text" id="msg" value="" />
</body>
</html>

那麼,js如何禁用浏覽器回車事件?我們知道,在HTML表單區域內,按回車時浏覽器的默認行為是自動提交表單。下面以這個為例說明js如何去禁用浏覽器回車事件:

代碼如下:
<html>
<head>
<script type="text/javascript">
//注冊鍵盤事件
document.onkeydown = function(e) {
 //捕捉回車事件
 var ev = (typeof event!= 'undefined') ? window.event : e;
 if(ev.keyCode == 13 && document.activeElement.id == "msg") {
  return false;//禁用回車事件
 }
}
</script>
</head>
<body>
<form action="form.php">
<input type="text" id="msg" name="msg" value="" />
<input type="submit" value="submit"/>
</form>
</body>
</html>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved