javascript 按回車鍵相應(yīng)按鈕提交事件
更新時間：2009年11月02日 17:11:50 作者：
在表單提交前經(jīng)常遇到表單驗證問題而常用的方法有以下兩種.
1、使用提交按鈕提交，在form表單中的onsubmit事件進行表單驗證：
<script type="text/javascript">
function onSub(){
//表單驗證代碼
}
</script>
<form action="" method="" onsubmit="javascript:onSub();">
2、使用button或圖片的onclick事件調(diào)用表單驗證代碼：
<input type="button" name="button" id="button" onclick="javascript:onSub();" />
<img src="圖片路徑" onclick="javascript:onSub();" />
但是，使用第二種方式進行提交表單時，不能在填寫完表單時,按回車不能提交表單。這給客戶的
感受是和直接使用提交按鈕提交表單是不同的；為了實現(xiàn)此項功能只需在你的頁面加上如下javascript代碼即可
function butOnClick() {
if (event.keyCode == 13) {
var button = document.getElementById("bsubmit"); //bsubmit 為botton按鈕的id
button.click();
return false;
}
}
在你表單最有一個輸入項中出發(fā)onkeydown事件調(diào)用butOnClick()函數(shù)即可；例如：登陸程序的最后一項是密碼，則
<input type="password" name="userPwd" onkeydown="javascript:butOnClick();" />
這樣當(dāng)你輸入完密碼后,按下回車鍵即可實現(xiàn)表單驗證和登錄操作(如果用戶名和密碼正確)。這是個人的一點總結(jié)，共享出來
大家齊分享！
復(fù)制代碼 代碼如下:
<script type="text/javascript">
function onSub(){
//表單驗證代碼
}
</script>
<form action="" method="" onsubmit="javascript:onSub();">
2、使用button或圖片的onclick事件調(diào)用表單驗證代碼：
復(fù)制代碼 代碼如下:
<input type="button" name="button" id="button" onclick="javascript:onSub();" />
<img src="圖片路徑" onclick="javascript:onSub();" />
但是，使用第二種方式進行提交表單時，不能在填寫完表單時,按回車不能提交表單。這給客戶的
感受是和直接使用提交按鈕提交表單是不同的；為了實現(xiàn)此項功能只需在你的頁面加上如下javascript代碼即可
復(fù)制代碼 代碼如下:
function butOnClick() {
if (event.keyCode == 13) {
var button = document.getElementById("bsubmit"); //bsubmit 為botton按鈕的id
button.click();
return false;
}
}
在你表單最有一個輸入項中出發(fā)onkeydown事件調(diào)用butOnClick()函數(shù)即可；例如：登陸程序的最后一項是密碼，則
<input type="password" name="userPwd" onkeydown="javascript:butOnClick();" />
這樣當(dāng)你輸入完密碼后,按下回車鍵即可實現(xiàn)表單驗證和登錄操作(如果用戶名和密碼正確)。這是個人的一點總結(jié)，共享出來
大家齊分享！
您可能感興趣的文章:
相關(guān)文章
JS實現(xiàn)設(shè)置ff與ie元素絕對位置的方法
這篇文章主要介紹了JS實現(xiàn)設(shè)置ff與ie元素絕對位置的方法,涉及JavaScript針對頁面元素及元素屬性的相關(guān)操作技巧,需要的朋友可以參考下2016-03-03
js讀寫COOKIE實現(xiàn)記住帳號或密碼的代碼(js讀寫COOKIE)
js實現(xiàn)記住帳號或密碼(js讀寫COOKIE) 的實現(xiàn)代碼，原理就是利用cookies保存于讀取功能。2010-05-05
JavaScript Rxjs mergeMap 的使用場合
這篇文章主要介紹了JavaScript Rxjs mergeMap 的使用場合,mergeMap 接收一個函數(shù)作為輸入?yún)?shù)，這個函數(shù)的輸入?yún)?shù)就是通過 pipe 鏈接 mergeMap 的 Observable 里包含的元素2022-07-07
什么是函數(shù)式編程？根據(jù)百度百科的描述，“函數(shù)式編程是種編程典范，它將電腦運算視為函數(shù)的計算。函數(shù)編程語言最重要的基礎(chǔ)是 λ 演算（lambda calculus）。而且λ演算的函數(shù)可以接受函數(shù)當(dāng)作輸入（參數(shù)）和輸出（返回值）?！?/div> 2015-10-10
js實現(xiàn)的類似于asp數(shù)據(jù)字典的數(shù)據(jù)類型代碼實例
這篇文章主要介紹了js實現(xiàn)的類似于asp數(shù)據(jù)字典的數(shù)據(jù)類型代碼實例,即js實現(xiàn)的字典數(shù)據(jù)類型,需要的朋友可以參考下2014-09-09
layer關(guān)閉彈出窗口觸發(fā)表單提交問題的處理方法
今天小編就為大家分享一篇layer關(guān)閉彈出窗口觸發(fā)表單提交問題的處理方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
通過js獲取上傳的圖片信息（臨時保存路徑，名稱，大?。┤缓笸ㄟ^ajax傳遞給后端的方法
最近有朋友向我請教，使用js獲取上傳圖片的信息然后通過ajax傳遞給后端，怎么實現(xiàn)呢？通過上網(wǎng)搜索大量資料，下面小編把我的解決辦法整理，分享給大家，需要的朋友可以參考下2015-10-10![我也種棵OO樹JXTree[js+css+xml]](http://img.jbzj.com/images/xgimg/bcimg7.png)
我也種棵OO樹JXTree[js+css+xml]...2007-04-04
整體思路是這樣的：判斷div內(nèi)部是否為空，如果為空，給出無數(shù)據(jù)提示；否則顯示正常頁面，下面給大家分享js判斷div內(nèi)容是否為空的方法，對判斷div內(nèi)容是否為空的相關(guān)知識感興趣的朋友一起學(xué)習(xí)吧2016-01-01
在使用原生框架開發(fā)小程序時遇到一個問題，在 app.wxss 中定義的全局樣式在自定義組件中不生效，本文就詳細的介紹一下，感興趣的可以了解一下2021-08-08最新評論