大江东去，浪淘尽，千古风流人物。故垒西边，人道是，三国周郎赤壁。乱石穿空，惊涛拍岸，卷起千堆雪。江山如画，一时多少豪杰。遥想公瑾当年，小乔初嫁了，雄姿英发。羽扇纶巾，谈笑间，樯橹灰飞烟灭。故国神游，多情应笑我，早生华发。人生如梦，一尊还酹江月。--来自奔跑的panda部落，panda每天与您一起进步

 1 <!DOCTYPE html>

 2 <html>

 3     <head>

 4         <meta charset="utf-8">

 5         <title></title>

 6         <style type="text/css">

 7             li {

 8                 list-style: none;

 9             }

10

11             .wrap input {

12

13                 border: none;

14                 border-bottom: 1px solid #999999;

15                 outline: none;

16

17             }

18             .wrap li{

19                 position: relative;

20                 width: 200px;

21             }

22             .img{

23                 width: 20px;

24                 height: 20px;

25                 position: absolute;

26                 right: 10px;

27                 top: 0;

28             }

29         </style>

30     </head>

31     <body>

32

33         <div class="wrap">

34             <li>

35                 <input type="password" name="" id="psd" value="" placeholder="密码框" />

36                 <div class="img">

37                     <img src="img/hide.png" style="width: 100%;" id="img">

38                 </div>

39             </li>

40         </div>

41         <script type="text/javascript">

42             var pwd = document.getElementById('psd');

43             var img = document.getElementById('img');

44             var flag = 0;

45             img.onclick = function(){

46                 if(flag == 0){

47                     pwd.type = 'text'

48                     img.src = 'img/show.png'

49                     flag = 1

50                 }else{

51                     pwd.type = 'password'

52                     img.src = 'img/hide.png'

53                     flag = 0;

54

55                 }

56             }

57

58         </script>

59     </body>

60 </html>

js 实现密码框的查看和隐藏的更多相关文章

  1. js关于密码框强弱度的提示

    三种密码强度的正则表达式: 较弱:全是数字或全是字母 6-16个字符:/^[0-9]{6,16}$|^[a-zA-Z]{6,16}$/; 中级:数字.26个英文字母 6-16个字符: /^[A-Za- ...

  2. Jquery 实现密码框的显示与隐藏【转载自http://blog.csdn.net/fengzhishangsky/article/details/11809069】

    <html> <head>  <script type="text/JavaScript"  src="jQuery-1.5.1.min.j ...

  3. JS控制文本框中的密码显示/隐藏功能

    <html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...

  4. spring mvc：常用标签库(文本框，密码框，文本域，复选框，单选按钮，下拉框隐藏于，上传文件等)

    在jsp页面需要引入:<%@taglib uri="http://www.springframework.org/tags/form" prefix="form&q ...

  5. jquery 实现 <imput>标签 密码框显示/隐藏密码功能

    1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 < ...

  6. 表单form的属性，单行文本框、密码框、单选多选按钮

    基础表单结构: <body> <h1> <hr /> <form action="" name="myFrom" en ...

  7. WPF文本框密码框添加水印效果

    WPF文本框密码框添加水印效果 来源: 阅读:559 时间:2014-12-31 分享: 0 按照惯例,先看下效果 文本框水印 文本框水印相对简单,不需要重写模板,仅仅需要一个VisualBrush ...

  8. [Asp.net]说说密码框和只读框

    作者:Wolfy出处:http://www.cnblogs.com/wolf-sun/ 引言 最近负责了一个公司的小项目,从前台到后代,都是自己搞的,为一个客户弄一个信息管理的小系统,虽然对界面什么的 ...

  9. WPF 之 文本框及密码框添加水印效果

    1.文本框添加水印效果 文本框水印相对简单,不需要重写模板,仅仅需要一个 VisualBrush 和触发器验证一下Text是否为空即可. <TextBox Name="txtSerac ...

  10. jquery实现密码框显示提示文字

    jquery实现密码框提示文字的功能. 代码:    <html>  <head>   3 <title>登录-jquery实现密码框显示文字-www.jbxue. ...

随机推荐

  1. 【GDKOI 2024 TG Day2】染色（set） 题解

    发现我们给一个点染上色后有: 我们称这是一个大小为 1 的十字. 进一步地,我们给这 5 个点再次染上色后有: 我们称这是一个大小为 2 的十字. 同理可得,我们给这 5 个点染上相同的大小为 2 的 ...

  2. 蚂蚁一面：GC垃圾回收时，内存分配和回收策略有哪些？

    文章首发于公众号:腐烂的橘子 蚂蚁面试主要为电话面试,期间也会要求使用编辑器手写算法题.作为一线互联网大厂,Java 基础知识是必备的,其中垃圾回收也是面试过程中的重中之重. Java 内存的自动管理 ...

  3. 阿里巴巴云原生混部系统 Koordinator 正式开源

    ​简介: 脱胎于阿里巴巴内部,经过多年双 11 打磨,每年为公司节省数十亿的混部系统 Koordinator 今天宣布正式开源.通过开源,我们希望将更好的混部能力.调度能力开放到整个行业,帮助企业客户 ...

  4. Java依赖冲突高效解决之道

    ​简介:由于阿里妈妈联盟团队负责业务的特殊性,系统有庞大的对外依赖,依赖集团六七十个团队服务及N多工具组件,通过此文和大家分享一下我们积累的一些复杂依赖有效治理的经验,除了简单技术技巧的总结外,也会探 ...

  5. [FAQ] uni-app 如何让页面不展示返回箭头图标

    默认情况是,有历史上一页的 页面会在左上角展示返回图标. 比如登录页不想展示返回,在跳转进来时可以使用 uni.redirectTo({}),它能够关闭其它页面,这样当前页就不会有返回箭头了. Ref ...

  6. 如何参与 .NET 的开发和设计

    现在 dotnet 属于 dotnet 基金会,所有开发者都可以向 dotnet 贡献代码和参与 .NET 的设计,参与路线决策.本文来告诉大家一些基本玩法,带着小伙伴们入坑 注意哦,参与 dotne ...

  7. 低开开发笔记(五)：修bug-深拷贝与浅拷贝

    好家伙   今天遇到一个bug 0.问题描述 描述如下:  代码如下: copynodefunc() { this.copynode = this.model.selected }, affixnod ...

  8. 移动端、微信小程序兼容性问题汇总（持续更新……

    1. safari浏览器字体不能自动随网页缩放调整大小 -webkit-text-size-adjust:100% 2. 点击<button><input>有灰色透明背景 -w ...

  9. R5_ES读写流程

    基本概念 refresh:es接收数据请求时先存入ES进程中的内存 Buffer ,默认每隔一秒(index.refresh_interval:1s)会从内存buffer中将数据写入 os cache ...

  10. elementui 时间戳和后台配合

    保存时间 思路: 前端传时间戳, 后台表里的时间类型为timestamp, model结构体tag设置为 *time.Time json:"activationTime" gorm ...