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


Posted in Javascript onMarch 22, 2017

话不多说,请看代码:

<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>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
Google Map API更新实现用户自定义标注坐标
Jul 29 Javascript
在html页面上拖放移动标签
Jan 08 Javascript
jQuery boxy弹出层插件中文演示及使用讲解
Feb 24 Javascript
ASP.NET jQuery 实例18 通过使用jQuery validation插件校验DropDownList
Feb 03 Javascript
js调试工具Console命令详解
Oct 21 Javascript
跟我学习javascript的作用域与作用域链
Nov 19 Javascript
Javascript中apply、call、bind的巧妙使用
Aug 18 Javascript
利用jQuery对无序列表排序的简单方法
Oct 16 Javascript
基于DOM节点删除之empty和remove的区别(详解)
Sep 11 Javascript
如何用webpack4带你实现一个vue的打包的项目
Jun 20 Javascript
JS使用for in有序获取对象数据
May 19 Javascript
基于p5.js 2D图像接口的扩展(交互实现)
Nov 30 Javascript
jquery实现图片平滑滚动详解
Mar 22 #jQuery
JavaScript中在光标处插入添加文本标签节点的详细方法
Mar 22 #Javascript
jQuery轻松实现无缝轮播效果
Mar 22 #jQuery
JavaScript登录记住密码操作(超简单代码)
Mar 22 #Javascript
原生JS京东轮播图代码
Mar 22 #Javascript
10道典型的JavaScript面试题
Mar 22 #Javascript
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 #jQuery
You might like
PHP CodeIgniter框架的工作原理研究
2015/03/30 PHP
PHP将MySQL的查询结果转换为数组并用where拼接的示例
2016/05/13 PHP
php 微信开发获取用户信息如何实现
2016/12/13 PHP
PHP排序算法之堆排序(Heap Sort)实例详解
2018/04/21 PHP
PHP使用SOAP调用API操作示例
2018/12/25 PHP
Jquery常用技巧收集整理篇
2010/11/14 Javascript
浅析jQuery的链式调用之each函数
2010/12/03 Javascript
浅析JS中document对象的一些重要属性
2014/03/06 Javascript
解析JavaScript的ES6版本中的解构赋值
2015/07/28 Javascript
js实现简单折叠、展开菜单的方法
2015/08/28 Javascript
JavaScript前端开发之实现二进制读写操作
2015/11/04 Javascript
Bootstrap Table使用方法详解
2016/08/01 Javascript
AngularJS基于ngInfiniteScroll实现下拉滚动加载的方法
2016/12/14 Javascript
js实现前端分页页码管理
2017/01/06 Javascript
详解vue-cil和webpack中本地静态图片的路径问题解决方案
2017/09/27 Javascript
jQuery实现的页面遮罩层功能示例【测试可用】
2017/10/14 jQuery
jquery 给动态生成的标签绑定事件的几种方法总结
2018/02/24 jQuery
Vue中 key keep-alive的实现原理
2018/09/18 Javascript
vue请求本地自己编写的json文件的方法
2019/04/25 Javascript
[48:21]林俊杰圣堂刺客超神杀戮秀
2014/10/29 DOTA
[54:33]2018DOTA2亚洲邀请赛小组赛 A组加赛 Liquid vs Optic
2018/04/03 DOTA
python中的多重继承实例讲解
2014/09/28 Python
python基于BeautifulSoup实现抓取网页指定内容的方法
2015/07/09 Python
Python编程之字符串模板(Template)用法实例分析
2017/07/22 Python
Python基于回溯法子集树模板解决马踏棋盘问题示例
2017/09/11 Python
python判断设备是否联网的方法
2018/06/29 Python
Python进程间通信Queue消息队列用法分析
2019/05/22 Python
python 使用matplotlib 实现从文件中读取x,y坐标的可视化方法
2019/07/04 Python
python常用排序算法的实现代码
2019/11/08 Python
html5视频常用API接口的实战示例
2020/03/20 HTML / CSS
Java 中访问数据库的步骤?Statement 和PreparedStatement 之间的区别?
2012/06/05 面试题
网页美工求职信范文
2014/04/17 职场文书
小学生一分钟演讲稿
2014/08/26 职场文书
幼儿园教师节演讲稿
2014/09/03 职场文书
2015年民主生活会发言材料
2014/12/15 职场文书
Java Lambda表达式常用的函数式接口
2022/04/07 Java/Android