為了省事很多時(shí)候希望可以按回車鍵來提交表單，要控制這些行為，可以借助JS來達(dá)到要求。
代碼如下：
%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
%@ include file="../../common/include_tag.jsp"%>
%@ include file="../../common/page_var.jsp"%>
!DOCTYPE HTML>
html>
head>
meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
title>%=pageTitle%>-用戶登錄/title>
%@ include file="../../common/page_head.jsp"%>
link rel="stylesheet" type="text/css"
href="s:url value='/css/common_green.css'/>" />
script type="text/javascript" src="s:url value='/js/jquery.min.js'/>">/script>
script type="text/javascript" src="s:url value='/js/common.js'/>">/script>
style type="text/css">
.logo{
padding-top: 20px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 20px;
font-size: 28px;
}
.top{
padding-bottom: 100px;
}
.login{
line-height: 32px;
}
.content {
width: 350px;
margin: 15px auto auto;
padding: 50px 50px;
border: 2px solid #ccc;
border-radius: 10px;
box-shadow: 0 0 30px #ccc;
}
.bottom{
padding-top: 100px;
}
.button{
margin-top: 10px;
margin-left: 105px;
}
.update {
margin: 0 auto;
padding: 0;
width: 98%;
}
.update td {
margin: 0;
height: 30px;
padding: 5px;
}
.update .name {
text-align: right;
}
.title_div {
width: 350px;
}
body {
background: url(" s : url value = '/images/gray_bg.png'/ >") 0 0
repeat-y #F6F6F6;
}
/style>
script type="text/javascript">
$(function() {
pilicat.title2div('title2div');
pilicat.keysubmit('form1', 'submit', true);
});
/script>
/head>
body>
div class="logo">首都機(jī)場空地自動化協(xié)同決策系統(tǒng)/div>
div class="rounded table">
div class="top">/div>
div class="content">
form id="form1" action="s:url value='/u/ulogin'/>" method="post">
div align="center">span style="color: red;">${captcha}/span>/div>
table class="table table-bordered table-striped" style="width: 310px; padding-left: 50px;">
tbody>
tr class="login">
td>span>賬 號: /span>/td>
td>input type="text" id="userName" name="userName"
class="input rounded" value="" placeholder="賬號" />/td>
/tr>
tr class="login">
td>span>密 碼: /span>/td>
td>input type="password" id="passWd" name="passWd"
class="input rounded" value="" placeholder="密碼" />/td>
/tr>
tr class="login">
td>span>驗(yàn)證碼: /span>/td>
td>input type="text" id="captcha" name="captcha" size="5" maxlength="5" class="input rounded" value="" placeholder="驗(yàn)證碼" />
img id="captcha" style="cursor: pointer; cursor: hand; margin-top: -5px; margin-right: -10px;" align="middle"
onclick="this.src='s:url value='/u/captcha.htm'/>?'+Math.random();"
src="s:url value='/u/captcha.htm'/>">
/td>
/tr>
tr class="login">
td colspan="2">
a id="submit" class="submit" href="javascript:;" onclick="submitForm();">登錄/a>
/td>
/tr>
/tbody>
/table>
/form>
/div>
div class="bottom">/div>
/div>
%@ include file="../../common/bottom.jsp"%>
/body>
/html>
解決方案：
把form表單放在一個div里面 ，然后對這個div監(jiān)聽事件$("#id").keydown(function (){});
#*#監(jiān)聽回車事件
document.onkeydown=function() {
if(event.keyCode==13) {
//這里提交你的表單
$('#ff_login').submit();
}
}
#*#頁面編寫js腳本進(jìn)行監(jiān)聽。。。
#*#js監(jiān)聽enter事件#*#
把form表單放在一個div里面 ，然后對這個div監(jiān)聽事件$("#id").keydown(function (){});
#*#獲取焦點(diǎn) 監(jiān)聽enter#*#
監(jiān)聽整個body的keypress事件，如果是回車鍵，激發(fā)submit按鈕的click事件，當(dāng)然你的click事件中會有相關(guān)的數(shù)據(jù)驗(yàn)證之類的，如果驗(yàn)證不過，不會提交。
希望本文所述對大家jsp程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:- JSP中的FORM表單中只有一個input文本時(shí)，按回車鍵將會自動提交表單
- js實(shí)現(xiàn)點(diǎn)擊圖片自動提交action的簡單方法
- JS實(shí)現(xiàn)問卷星自動填問卷腳本并在兩秒自動提交功能
