当前位置: 移动技术网 > IT编程>开发语言>JavaScript > Javascript实现登录记住用户名和密码功能

Javascript实现登录记住用户名和密码功能

2019年03月20日  | 移动技术网IT编程  | 我要评论

话不多说,请看代码:

  <script type="text/javascript">
  $(document).ready(function () {
   $("#useraccount").focus();
   //记住用户名和密码
   $('#remebers').click(function () {
    if ($("#useraccount").val() == "") {
     alert("用户名不能为空!");
    }
    if($("#userpassword").val() == "")
    {
     alert("密码不能为空!");
    }
    else {
     if ($('#remebers').attr("checked")) {
      setcookie("uname", $("#useraccount").val(), 60);
      setcookie("upwd", $("#userpassword").val(), 60);
     }
     else {
      delcookie("uname");
      delcookie("upwd");
     }
    }
   });
   if (getcookie("uname") != null)
   {
    $('#remebers').attr("checked", "checked");
    $('#useraccount').val(getcookie("uname"));
    $('#userpassword').val(getcookie("upwd"));
   }
  })
  //写cookies
  function setcookie(name, value) {
   var days = 30;
   var exp = new date();
   exp.settime(exp.gettime() + days * 24 * 60 * 60 * 1000);
   document.cookie = name + "=" + escape(value) + ";expires=" + exp.togmtstring();
  }
  //读取cookies 
  function getcookie(name) {
   var arr, reg = new regexp("(^| )" + name + "=([^;]*)(;|$)");
   if (arr = document.cookie.match(reg)) return unescape(arr[2]);
   else return null;
  }
  //删除cookies 
  function delcookie(name) {
   var exp = new date();
   exp.settime(exp.gettime() - 1);
   var cval = getcookie(name);
   if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.togmtstring();
  }
 </script>
  <div class="main">
     <section id="login_form">
      @using (html.beginform("login", "account", new { returnurl = viewbag.returnurl }, formmethod.post))
      {
       @html.antiforgerytoken()
       @html.validationsummary(true)
       <table>
        <tr>
         <td align="right">账 号:</td>
         <td align="left"><input type="text" id="useraccount" name="useraccount" /> @html.validationmessagefor(m => m.useraccount)</td>
        </tr>
        <tr>
         <td align="right">密 码:</td>
         <td align="left">
          <input type="password" id="userpassword" name="userpassword" />
@html.validationmessagefor(m => m.userpassword)
         </td>
        </tr>
        <tr>
         <td></td>
         <td align="left">
          <input name="remebers" id="remebers" type="checkbox" />
          <span style="color:#4a4949">记住用户名和密码</span>
         </td>
        </tr>
        <tr>
         <td></td>
         <td align="left">
          <input type="submit" name="submit" id="submit" value="" style=" background: url(../../images/login/login_submit.jpg) no-repeat; height: 25px; width: 59px; " />
           
          <input type="reset" name="reset" id="reset" value="" style="background: url(../../images/login/login_reset.jpg) no-repeat; height: 25px; width: 59px; " />
         </td>
        </tr>
       </table>
      }
     </section>
     <div class="note">
      * 不要在公共场合保存登录信息;<br />
      * 为了保证您的帐号安全,退出系统时请注销登录
      <span id="msg_tip"></span>
     </div>
    </div>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持移动技术网!

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网