前端——记住用户名案例

最新推荐文章于 2024-07-20 18:16:53 发布
最新推荐文章于 2024-07-20 18:16:53 发布
阅读量342 收藏
点赞数
分类专栏： 前端案例 文章标签： 前端 javascript 服务器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45166755/article/details/125550274
版权
该博客介绍了如何在前端实现记住用户名的功能。通过利用localStorage进行数据存储，当用户关闭和再次打开页面时，可以自动显示之前的用户名。博主详细讲解了判断及处理逻辑，包括在表单中显示用户名和根据复选框状态触发change事件来决定存储或移除用户名。
摘要由CSDN通过智能技术生成

案例
如果勾选记住用户名， 下次用户打开浏览器，就在文本框里面自动显示上次登录的用户名
分析

  • 把数据存起来，用到本地存储
  • 关闭页面，也可以显示用户名，所以用到localStorage
  • 打开页面，先判断是否有这个用户名，如果有，就在表单里面显示用户名，并且勾选复选框
  • 当复选框发生改变的时候 change事件
  • 如果勾选，就存储，否则就移除
    代码
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name&#
最低0.47元/天 解锁文章
神秘的弟弟
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js本地存储+记住用户名案例
daisyboom的博客
08-07 180
删除数据</button><button class="del">清空所有数据</button><button class="del">清空所有数据</button><button class="set">存储数据</button><button class="get">获取数据</button><button class="set">存储数据
js实现登录时记住用户名
08-05
NULL 博文链接：https://hw1287789687.iteye.com/blog/2053897
记住密码
YW博客
09-10 165
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <input t
本地储存(设置和获取信息)
weixin_33755554的博客
12-14 402
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
使用js记住用户名
weixin_30929011的博客
03-04 113
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">...
JS实现记住用户名
w645444407的博客
06-22 504
本文参考https://www.cnblogs.com/zoie-blog/p/6905467.html一文写出代码中的js部分基本上是参考的该博主的，仅将保存用户名部分放入了$("#remember").change(function(){｝中，这样才能实现点击记录&lt;html&gt; &lt;body&gt; &lt;img src="${ctx}/assets/admin/login/i...
北大青鸟案例——MyQQ源码
10-27
【北大青鸟案例——MyQQ源码】是一个典型的教育培训项目，旨在帮助学员深入理解软件开发流程，特别是即时通讯（IM）应用的实现。这个案例涵盖了数据库设计与编程实践，是学习Java或相关技术的宝贵资源。 首先，让...
jsp 案例——网上书店项目
07-10
总的来说，"jsp案例——网上书店项目"是一个全面的Web开发实践，涵盖了Java Web开发的多个关键方面，包括数据库设计、前后端交互、用户认证、购物车逻辑、订单处理以及后台管理。通过学习和实践这个项目，开发者能够...
前端经典——vue实现登录页面开屏广告+校验demo.rar
11-29
在本项目中，“前端经典——vue实现登录页面开屏广告+校验demo”是一个使用Vue.js框架构建的示例应用，旨在展示如何在前端开发中创建一个包含登录页面、开屏广告以及用户输入校验功能的应用。Vue.js是当前非常流行的...
jsp开发案例——租房系统jsp列子
03-11
【jsp开发案例——租房系统jsp列子】 在IT行业中，JavaServer Pages（JSP）是一种广泛使用的服务器端脚本语言，用于动态网页开发。本案例是基于JSP技术开发的一个租房系统，它涵盖了用户登录、房屋信息查询以及会员...
Login.zip_前端开发_HTML_
08-10
【标题】"Login.zip"是一个前端开发相关的压缩包，主要关注HTML技术，它涉及到用户登录界面的实现，允许用户通过不同的身份验证方式——用户名、手机号或邮箱进行登录。这个项目中，前端界面不仅包含了基本的输入...
js记住用户名密码
直到世界的尽头
04-13 2326
现在很多浏览器都会提供是否记住密码的功能。 当我们写登录模块是  如果是使用 form提交 则能被 浏览器识别到 但是form提交会在链接上暴露出传的参数 如果是用js做的登录   浏览器是检测不到的 这样我们需要自己加上 js记住密码的功能  主要用到了 cookie.js 以及login.jsp 代码如下： cookie.js //新建cookie。 //hours为
js保存用户名
上善若水
08-15 361
[code="java"] js COOKIE 记住帐号或密码 function checkInCorrect() //判断用户名和密码是否为空 { if (document.getElementById('txtUserName').value=="") { alert('请输入用户名！') document.getElement...
JavaScript实现记住用户名功能
shan33__的博客
03-09 626
通过JavaScript实现点击复选框将用户名存储到本地中，再次打开页面，输入框中自动输入上次保存的数据。
用Javascript实现记住账号和密码
茂茂的博客
02-09 4177
用Javascript实现记住账号和密码 正在学习大前端中，有代码和思路不规范不正确的地方往多多包涵，感谢指教 在我们日常使用app以及网站时，通常会遇见浏览器自动储存用户的账号密码等相关情况，那么，这个功能我们可以使用JS的本地存储来进行实现 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content
【html实现记住账号、记住密码功能】
qq_45278500的博客
11-09 4520
html+js实现记住账号密码功能
前端实现登录时记住密码功能
weixin_筱玉的博客
04-18 8899
vue 项目 前端实现记住密码功能
js根据输入身份证信息点击按钮带出出生日期，年龄，性别
weixin_43222946的博客
01-26 1948
&lt;html&gt;   &lt;head&gt;    &lt;title&gt;&lt;/title&gt;    &lt;/head&gt;   &lt;body&gt; &lt;script&gt; function a(){ var idcardValue=document.getElementById("identifyNumber").value; var
前端面试题日常练-day97 【Less】
最新发布
qq_44640575的博客
07-20 348
border-radius()函数用于在Less中生成圆形边框效果。通过设置border-radius()函数，我们可以为元素的边框添加圆角效果，使边框呈现圆形的外观，从而美化页面元素的边框样式。
vscode:Web前端——登录、注册界面
06-07
好的，我可以帮你提供一些思路。首先，登录和注册界面是Web前端的常见功能，可以使用HTML、CSS、JavaScript等技术来实现。以下是一些简单的步骤： 1.设计页面布局：可以参考一些常见的登录、注册页面的设计，例如输入框、按钮的布局和样式等。 2.编写HTML代码：根据设计的页面布局，编写HTML代码，将页面元素放到合适的位置。 3.使用CSS美化页面：通过CSS样式，可以实现页面的美化，例如颜色、字体、边框、背景等。 4.编写JavaScript代码：登录和注册功能需要与服务器进行交互，可以使用JavaScript编写相关代码，例如发送请求、验证输入等。 5.测试和调试：完成以上步骤后，可以进行测试和调试，确保功能正常。 总的来说，实现登录和注册界面需要一些前端技术的知识和经验，建议你参考一些相关的教程和示例，逐步学习和实践。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值