回车键实现登录
jquery事件函數(shù)的用法：
? 1. 選擇器.click(function(){//給指定的元素添加事件
????? //js代碼
?? });
? 2. 選擇器.click();//在指定的元素上模擬發(fā)生一次事件
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/"; %> <html> <head> <meta charset="UTF-8"><base href="<%=basePath%>"> <link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script> <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script><script type="text/javascript">$(function () {//給整個(gè)瀏覽器窗口添加鍵盤(pán)按下事件$(window).keydown(function (event) {//如果按的是回車(chē)鍵，則提交登錄請(qǐng)求if (event.keyCode==13){$("#loginBtn").click();}})//給登錄按鈕添加單擊事件$("#loginBtn").click(function () {//收集參數(shù)var loginAct=$.trim($("#loginAct").val());var loginPwd=$.trim($("#loginPwd").val());var isRemPwd=$("#isRemPwd").prop("checked");//表單驗(yàn)證if (loginAct==""){alert("用戶名不能為空！");return;}if (loginPwd==""){alert("密碼不能為空！");return;}//點(diǎn)擊登錄后顯示正在驗(yàn)證$("#msg").html("正在努力驗(yàn)證中。。。")//發(fā)送請(qǐng)求$.ajax({url:'settings/qx/user/login.do',data:{loginAct:loginAct,loginPwd:loginPwd,isRemPwd:isRemPwd},type:'post',dataType:'json',success:function (data) {if (data.code=="1"){//登錄成功，跳轉(zhuǎn)到業(yè)務(wù)的主頁(yè)面window.location.href="workbench/index.do";}else {//登錄失敗,顯示提示信息$("#msg").html(data.message);}}});});});</script></head> <body><div style="position: absolute; top: 0px; left: 0px; width: 60%;"><img src="image/IMG_7114.JPG" style="width: 100%; height: 90%; position: relative; top: 50px;"></div><div id="top" style="height: 50px; background-color: #3C3C3C; width: 100%;"><div style="position: absolute; top: 5px; left: 0px; font-size: 30px; font-weight: 400; color: white; font-family: 'times new roman'">CRM <span style="font-size: 12px;">客戶關(guān)系管理系統(tǒng)</span></div></div><div style="position: absolute; top: 120px; right: 100px;width:450px;height:400px;border:1px solid #D5D5D5"><div style="position: absolute; top: 0px; right: 60px;"><div class="page-header"><h1>登錄</h1></div><form action="workbench/index.html" class="form-horizontal" role="form"><div class="form-group form-group-lg"><div style="width: 350px;"><input class="form-control" id="loginAct" type="text" placeholder="用戶名"></div><div style="width: 350px; position: relative;top: 20px;"><input class="form-control" id="loginPwd" type="password" placeholder="密碼"></div><div class="checkbox" style="position: relative;top: 30px; left: 10px;"><label><input type="checkbox" id="isRemPwd"> 十天內(nèi)免登錄</label> <span id="msg" style="color: red;"></span></div><button type="button" id="loginBtn" class="btn btn-primary btn-lg btn-block" style="width: 350px; position: relative;top: 45px;">登錄</button></div></form></div></div> </body> </html>?不設(shè)置該jquery事件，只能通過(guò)鼠標(biāo)點(diǎn)擊實(shí)現(xiàn)登錄，導(dǎo)致用戶操作性差。
設(shè)置后就可以按擊回車(chē)鍵實(shí)現(xiàn)登錄操作，同時(shí)擁有所有的登錄事件函數(shù)中的所有判斷。
?以上均是通過(guò)回車(chē)鍵實(shí)現(xiàn)
總結(jié)
- 上一篇： 北风修仙笔记—2020年5月
- 下一篇： 基于UCOS-III的雷电传奇自制小游戏