zoukankan      html  css  js  c++  java
  • 简单的Web登录

    前几天跟朋友一起写了个简单的用户注册页面  

    也没啥要求就是随便写写 然后加上了几个简单的JS验证,本来想删的  还是放在这里吧,也许什么时候就用到了

    PS:JS学习的是真的是很折磨人 一大段代码一个标点少写了 几乎整个就完了,现在一般都是简单的用一下JS,等以后用到难的了 再回过头在学习吧 

    这个注册界面没什么样式,就是验证用户名、密码、正则表达式验证一下邮箱,在实际运用中一般都是浏览器端加上服务器段一起验证的,过几天再把服务器段的验证加上吧,以为没有服务器段的验证

    很不安全,如果没有服务器验证几乎就相当于门上挂了把锁,仅仅是挂那里了,用户也许可以通过链接直接进去 。。。废话不多说直接就是代码吧  真的没有啥技术含量 暂时先放这里吧  有时间了再继续补点

      1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      2 <html xmlns="http://www.w3.org/1999/xhtml">
      3 <head>
      4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      5 <title>无标题文档</title>
      6 <script type="text/javascript">
      7     function fun1()
      8     {
      9         var name = document.getElementById('name').value;/*获得用户名*/
     10         var FirstCharOfName = name.charAt(0);/*取得用户名第一个字符*/
     11         if((!isNaN(FirstCharOfName))||name==""||name==null)/*isNaN()是用来判断参数是不是数字 不是数字的话返回true 否则你懂的*/
     12         {
     13             alert("用户名不能为空也不能以数字开头!!")
     14             name="";/*再把name的输入框清空*/
     15         }
     16         else
     17         {
     18             var password = document.getElementById("password").value;/*获得用户密码*/
     19             var repassword = document.getElementById("repassword").value;/*获得用户第二次输入的密码*/
     20             if(!(password==repassword))
     21             {
     22                 alert("密码不一致!");
     23             }
     24             else
     25                 {
     26                     var CheckMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2}$)/;
     27                     var email = document.getElementById("email").value;
     28                     
     29                     var flag = CheckMail.test(email);
     30                     
     31                     if(flag)
     32                     {
     33                         alert("恭喜你注册成功! 请到"+email+"收件箱中确认!"+"茹屌 肯定会亲测 ~ ~");
     34                     }
     35                     else
     36                     {
     37                         alert("请输入正确的邮箱!!");
     38                     }
     39                 }
     40         }
     41         
     42     }
     43 </script>
     44 
     45 </head>
     46 
     47 <body>
     48     <table>
     49     <form>
     50         <table width="500" border="0" align="center">
     51   <caption align="left">
     52     用户注册
     53   </caption>
     54   <br /><br />
     55   <tr>
     56     <td width="100px">用户名:</td>
     57     <td><input  type="text" name="username" id="name" style=" 170px;"/></td>
     58   </tr>
     59   <tr>
     60     <td>密码:</td>
     61     <td><input  type="password" id="password" style=" 170px;"/></td>
     62   </tr>
     63   <tr>
     64     <td>确认密码:</td>
     65     <td><input  type="password" id="repassword" style=" 170px;"/></td>
     66   </tr>
     67   
     68     <tr>
     69     <td>性别:</td>
     70     <td><input name="sex" type="radio" value="male" /> 71         <input name="sex" type="radio" value="female" /></td>
     72       </tr>
     73     
     74   <tr>
     75     <td>城市:</td>
     76     <td> <select name="userType">
     77     <option value="1">北京</option>
     78     <option value="3">河南</option>
     79     <option value="4">郑州</option>
     80     <option value="5">广州</option>
     81     <option value="5">杭州</option>
     82     <option value="2">上海</option> </select></td>
     83   </tr>
     84 
     85   <tr>
     86     <td>兴趣爱好:</td>
     87     <td><input type="checkbox" name="hobby" value="reading" /> 阅读
     88         <input type="checkbox" name="hobby" value="swimming" />游泳
     89         <input type="checkbox" name="hobby" value="music" />音乐
     90         <input type="checkbox" name="hobby" value="running" />慢跑
     91         </td>
     92   </tr>
     93   <tr>
     94     <td>电子邮件:</td>
     95     <td><input  type="text" id="email" style=" 170px;"/></td>
     96   </tr>
     97   
     98  <tr>
     99      <td>
    100         <input type="submit" value="登录"  onclick="fun1()"/>
    101     </td>
    102     <td>
    103         <input type="reset" value="注销" />
    104     </td>
    105  </tr>
    106 </table>
    107 </form>
    108     </table>
    109     
    110 
    111     
    112 </body>
    113 </html>
    Login
  • 相关阅读:
    关于区间 $mex$ 的几种做法
    Selenium+TestNG+Maven+Jenkins+SVN(转载)
    Selenium+Java的TestNG测试报告优化
    使用Log4J收集日志
    Selenium+TestNG+Maven(2)
    自动化测试用例设计实例
    自动化测试用例的编写规则
    selenium 总结篇,常见方法和页面元素的操作
    Selenium Webdriver元素定位的八种常用方式(转载)
    selenium+java利用AutoIT实现文件上传
  • 原文地址:https://www.cnblogs.com/mauiie/p/Mauiie_Login.html
Copyright © 2011-2022 走看看