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 相关文章推荐
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
Nov 14 Javascript
使用js的replace()方法查找字符示例代码
Oct 28 Javascript
jquery 新建的元素事件绑定问题解决方案
Jun 12 Javascript
javascript中加var和不加var的区别 你真的懂吗
Jan 06 Javascript
Bootstrap 手风琴菜单的实现代码
Jan 20 Javascript
jQuery中clone()函数实现表单中增加和减少输入项
May 13 jQuery
js实现多张图片延迟加载效果
Jul 17 Javascript
jQuery中each遍历的三种方法实例分析
Sep 07 jQuery
JavaScript中this用法学习笔记
Mar 17 Javascript
JS实现简单的文字无缝上下滚动功能示例
Jun 22 Javascript
解决Vue中的生命周期beforeDestory不触发的问题
Jul 21 Javascript
openLayer4实现动态改变标注图标
Aug 17 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新手NOTICE错误常见解决方法
2011/12/07 PHP
PHP中使用正则表达式提取中文实现笔记
2015/01/20 PHP
php实现将Session写入数据库
2015/07/26 PHP
PHP Imagick完美实现图片裁切、生成缩略图、添加水印
2016/02/22 PHP
Laravel框架控制器的middleware中间件用法分析
2019/09/30 PHP
jQuery DOM操作小结与实例
2010/01/07 Javascript
js函数参数设置默认值的一种变通实现方法
2014/05/26 Javascript
JQuery插件iScroll实现下拉刷新,滚动翻页特效
2014/06/22 Javascript
JS实现的简洁纵向滑动菜单(滑动门)效果
2015/10/19 Javascript
JS实现双击屏幕滚动效果代码
2015/10/28 Javascript
jQuery选择器基础入门教程
2016/05/10 Javascript
web.js.字符串与正则表达式操作
2017/05/13 Javascript
基于jQuery使用Ajax动态执行模糊查询功能
2018/07/05 jQuery
js get和post请求实现代码解析
2020/02/06 Javascript
js函数柯里化的方法和作用实例分析
2020/04/11 Javascript
[03:17]DOTA2英雄基础教程 剧毒术士
2013/12/12 DOTA
[02:32]DOTA2亚洲邀请赛 VG战队巡礼
2015/02/03 DOTA
python连接mongodb操作数据示例(mongodb数据库配置类)
2013/12/31 Python
以Python的Pyspider为例剖析搜索引擎的网络爬虫实现方法
2015/03/30 Python
python读取word文档的方法
2015/05/09 Python
详解Python中的from..import绝对导入语句
2016/06/21 Python
Python中的单继承与多继承实例分析
2018/05/10 Python
python 返回一个列表中第二大的数方法
2019/07/09 Python
使用Filter过滤python中的日志输出的实现方法
2019/07/17 Python
Django 自动生成api接口文档教程
2019/11/19 Python
解决Keyerror ''acc'' KeyError: ''val_acc''问题
2020/06/18 Python
python设置表格边框的具体方法
2020/07/17 Python
基于CSS3的CSS 多栏(Multi-column)实现瀑布流源码分享
2014/06/11 HTML / CSS
解决img标签上下出现间隙的方法
2016/12/14 HTML / CSS
html5写一个BUI折叠菜单插件的实现方法
2019/09/11 HTML / CSS
广告学毕业生求职信
2014/01/30 职场文书
手工社团活动方案
2014/02/17 职场文书
动物科学专业求职信
2014/07/27 职场文书
小学生十佳少年事迹材料
2014/08/20 职场文书
2014年林业工作总结
2014/12/05 职场文书
Redis官方可视化工具RedisInsight安装使用教程
2022/04/19 Redis