在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
引言项目到目前告一段落,目前进入测试阶段,下周就要去部署了。虽然项目不大,但是从头到尾都是自己一个人负责,在完成编码之后,对代码进行走查,命名规范,业务逻辑,代码优化等,能负责一个项目的整个编码,非常的兴奋啊。 技术用到的技术:
工具
web端界面该项目,为管理员使用,类似一个简单的管理工具。对样式要求不高就从网上找了一个样式,扒取的样式。 登录界面: 页面主要代码: 1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="PYC.SignatureNX.Login" %> 2 3 <!DOCTYPE html> 4 5 <html xmlns="http://www.w3.org/1999/xhtml"> 6 <head runat="server"> 7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 8 <title>登录</title> 9 <link href="CSS/admin_login.css" rel="stylesheet" /> 10 <script type="text/javascript" src="Scripts/jquery-1.10.2.js"></script> 11 <script type="text/javascript"> 12 $(function () { 13 //页面加载,用户名文本框获得焦点 14 $("#txtCode").focus(); 15 //密码框获得焦点,断用户是否存在 16 $("#txtPwd").focus(function () { 17 var strCode = $("#txtCode").val(); 18 if (strCode == "") { 19 alert("请输入用户名"); 20 $("#txtCode").focus(); 21 return; 22 } else { 23 AjaxRequest(strCode, "", "Exist"); 24 } 25 26 }); 27 //单击登录按钮,验证密码是否存在,存在则登录,不存在重新输入用户密码 28 $("#btnLogin").click(function () { 29 var strCode = $("#txtCode").val(); 30 var strPwd = $("#txtPwd").val(); 31 if (strCode == "") { 32 alert("请输入用户名"); 33 return; 34 } else if (strPwd == "") { 35 alert("请输入密码"); 36 return; 37 } else { 38 AjaxRequest(strCode, strPwd, "SignIn"); 39 } 40 41 }); 42 43 }); 44 //ajax请求,验证用户名,密码 45 function AjaxRequest(code, pwd, method) { 46 //拼接参数 47 var strData = "strCode=" + code 48 if (pwd != "") { 49 strData += "&strPwd=" + pwd; 50 } 51 $.ajax({ 52 type: "POST", 53 url: "Ashx/Login.ashx?action=" + method, 54 data: strData, 55 contentType: "application/x-www-form-urlencoded", 56 dataType: "text", 57 success: function (data) { 58 if (data == "-1") { 59 alert("该用户不存在,请重新输入"); 60 $("#txtCode").val(""); 61 $("#txtCode").focus(); 62 return false; 63 } else if (data == "0") { 64 alert("密码不正确,请重新输入"); 65 $("#txtPwd").val(""); 66 $("#txtPwd").focus(); 67 return false; 68 } else if (data == "1") { 69 window.location.href = "Main.aspx"; 70 } 71 }, 72 //参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。 73 error: function (XMLHttpRequest, textStatus, errorThrown) { 74 //请求失败,弹出错误状态码 75 alert(textStatus); 76 } 77 }); 78 } 79 </script> 80 <script type="text/javascript"> 81 //回车触发登录事件 82 function keyLogin() { 83 //获得用户名和密码 84 var strCode = $("#txtCode").val(); 85 var strPwd = $("#txtPwd").val(); 86 //如果按下回车键,此时用户名为空,则提示,用户名文本框获得焦点,并阻止提交 87 if (event.keyCode == 13 && strCode == "") { 88 alert("请输入用户名"); 89 $("#txtCode").val(""); 90 $("#txtCode").focus(); 91 return; 92 } else if (event.keyCode == 13 && strPwd == "") { 93 //如果按下回车键,此时密码为空,则提示,密码文本框获得焦点,并阻止提交 94 alert("请输入密码"); 95 $("#txtPwd").val(""); 96 $("#txtPwd").focus(); 97 return; 98 } 99 //如果按下回车键,并且用户名和密码都不为空,触发登录按钮的单击事件,进行提交验证 100 if (event.keyCode == 13 && strCode != "" && strPwd != "") //回车键的键值为13 101 document.getElementById("btnLogin").click(); //调用登录按钮的登录事件 102 } 103 </script> 104 </head> 105 <body onkeyup="keyLogin();"> 106 <form id="form1" runat="server"> 107 <div class="admin_login_wrap"> 108 <h1>系统登录窗口</h1> 109 <div class="adming_login_border"> 110 <div class="admin_input"> 111 112 <ul class="admin_items"> 113 <li> 114 <label for="user">用户名:</label> 115 <input type="text" name="txtCode" value="" id="txtCode" size="40" class="admin_input_style" /> 116 </li> 117 <li> 118 <label for="pwd">密码:</label> 119 <input type="password" name="txtPwd" value="" id="txtPwd" size="40" class="admin_input_style" /> 120 </li> 121 <li> 122 <input type="button" tabindex="3" id="btnLogin" value="登录" class="btn btn-primary" /> 123 </li> 124 </ul> 125 126 </div> 127 </div> 128 </div> 129 130 </form> 131 </body> 132 </html> 业务逻辑:用户名失去焦点时,进行用户名是否存在。使用ajax进行无刷新登录。 人员信息列表页面: 导入过程: 结果: 上传签名人样本: 单击人员列表中的上传,弹出上传签名样本的窗口。 页面主要代码: 1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Main.aspx.cs" Inherits="PYC.SignatureNX.Main" %> 2 3 <!DOCTYPE html> 4 <%@ Register Assembly |
请发表评论