密码框的点击眼睛的显示与隐藏，图标引用是bootstrap中的fontawesome（复制整个 font-awesome 文件夹到您的项目中）还需要引入 ?<link rel="stylesheet" type="text/css" href="bootstrap.min.css"> ?<link rel="stylesheet" type="text/css" href="Font-Awesome/css/font-awesome.min.css"><!doctype html><html> ???<head> ???????????<meta charset="utf-8"> ???????????<title>密码框</title> ???????????<link rel="stylesheet" type="text/css" href="bootstrap.min.css"> ???????????<link rel="stylesheet" type="text/css" href="Font-Awesome/css/font-awesome.min.css"> ???</head><body> ???<div class="content"> ???????<div class="input_block"> ???????????<i class="fa fa-eye" onclick="hideShowPsw()" id="eye"></i> ???????????<input type="password" id="password" placeholder="密码"/> ???????</div> ???</div> ??<script type="text/javascript"> ???????????var eye = document.getElementById("eye"); ???????????var password = document.getElementById("password"); ???????????//隐藏text block，显示password block ???????????function hideShowPsw(){ ???????????????????if (password.type == "password") { ???????????????????????????password.type = "text"; ???????????????????????????eye.className=‘fa fa-eye-slash‘ ???????????????????}else { ???????????????????????????password.type = "password"; ???????????????????????????eye.className=‘fa fa-eye‘ ???????????????????} ???????????????} ???</script></body></html>js实现密码框的点击眼睛的显示与隐藏
原文地址：http://blog.51cto.com/12885303/2137186