首先我说下最简单的思路，其实我也尝试了很多方法来实现，但是最简单的还是直接获取type类型进行改变，下边上代码，防止有些新手看不懂我会详细的标出注释，我也是新手，大神请指教
jquery 脚本文件自己去下载，最好在1.7以上版本，我这儿用的1.9的版本，以后不会全部粘贴出来了，只粘贴重要的部分，其它部分自己补齐
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.9.1.min.js" type="text/javascript" charset="utf-8"></script>
<title></title>
</head>
<body>
<style type="text/css">
input{display: inline;}
</style>
<label>账号: </label><input type="text" name="text" id="text" value="" /></br></br>
<label>密码: </label><input type="password" name="password" id="password" value="" />
<input type="checkbox" name="" id="box" value="" /><label>显示密码</label>
<script type="text/javascript">
$(function(){
//给#box 绑定一个点击事件
$("#box").on("click",function(){
//获取input里边ID为password 的type类型
var a = $('#password').attr('type');
//判断单选框是否被选中
if($('#box').is(':checked')){
//判断获取的type类型是否是password
if(a = password){
//给input里边ID等于password的type类型变为text
$('#password').attr('type','text');
// alert("密码显示出来");
}
}else{
//判断获取的type类型是否是password
if(a != password){
//给input里边ID等于password的type类型变为password
$('#password').attr('type','password');
// alert("密码变成。。。了");
}
}
});
});
</script>
</body>
</html>