jquery 实现密码框的显示与隐藏示例代码

代码如下:

<html>
<head>
<script type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#chk").bind({
click: function(){
if($(this).attr("checked")){
$("#passwd2").val($("#passwd").val());
$("#passwd").hide();
$("#passwd2").show();
}else{
$("#passwd").val($("#passwd2").val());
$("#passwd2").hide();
$("#passwd").show();
}
}
});
});
</script>
</head>
<body>
<form name="formName">
<input id="passwd" type="password"
size="24" maxlength="17"
style="ime-mode: disabled; display: inline;"/>
<input id="passwd2" type="text"
size="24" maxlength="17"
style="ime-mode: disabled; display: none;" />
<input id="chk" type="checkbox" />显示密码
</form>
</body>
</html>

赞 (0)

相关推荐

  • jQuery通过改变input的type属性实现密码显示隐藏切换功能

    一般我们做登录注册的时候都会提供一个让用户选择自己输入的密码是否显示的需求, 这种需求我们肯定会想到只要动态改变input的type属性不就好了(text显示/password隐藏): 于是我用了$(''#id).attr('type', 'password')这个API 然而结果并不是我想的那样,出错了 HTML 代码 Uncaught Error: type property can't be changed 意思大概就是这个属性不能被修改. 于是我就googl一手. 然而我得到的结果是这样

  • jQuery输入框密码的显示隐藏【代码分享】

    jQuery输入框密码的显示隐藏【代码分享】

    效果图: 代码如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8" /> <title>jQuery输入框密码显示隐藏代码</title> <!--手机端需要添加--> <meta name="viewport" content="width=device-widt

  • 密码框显示提示文字jquery示例

    复制代码 代码如下: <html> <head> <title>登录</title> <script type="text/javascript" src="./jquery-1.3.2.min.js"></script> <script> $(document).ready(function(){ $(".text_login").focus(function(

  • jquery 实现密码框的显示与隐藏示例代码

    复制代码 代码如下: <html> <head> <script type="text/javascript" src="jquery-1.5.1.min.js"></script> <script type="text/javascript"> $(function(){ $("#chk").bind({ click: function(){ if($(this).

  • JS弹出层的显示与隐藏示例代码

    复制代码 代码如下: <!--弹出层的显示与隐藏--> <script type="text/javascript"> //弹出层的显示 //overlays:为遮罩层的ID //wins:弹出层窗体的ID //弹出层中用于拖动的ID function popDIV_show(overlays,wins,wins_title) { var oLays = documentgetElementById(overlays); var oWins = document

  • JS实现密码框的显示密码和隐藏密码功能示例

    JS实现密码框的显示密码和隐藏密码功能示例

    本文实例讲述了JS实现密码框的显示密码和隐藏密码功能.分享给大家供大家参考,具体如下: 运行效果图如下: 完整实例代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <form method="POST" action="

  • android实现密码框右侧显示小眼睛

    本文实例为大家分享了android实现密码框右侧显示小眼睛的具体代码,供大家参考,具体内容如下 实现效果 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" andro

  • jQuery实现左侧导航模块的显示与隐藏效果

    jQuery实现左侧导航模块的显示与隐藏效果

    本文实例讲述了jQuery实现左侧导航模块的显示与隐藏效果.分享给大家供大家参考,具体如下: 1.效果如图所示: 2.html代码: <div class="content_left"> <div class="global_module news"> <h3>最新动态</h3> <div class="scrollNews" > <ul> <li><a h

  • Android 使用jQuery实现item点击显示或隐藏的特效的示例

    本文介绍了Android 使用jQuery实现item点击显示或隐藏的特效的示例,分享给大家,具体如下: 效果图 分析 上图中的功能在很多APP上都可能用到过,例如app的帮助界面,告诉用户如何使用APP 一般的实现方式都是通过ListView来实现的,实际上此类需求非常简单,完全可以用WebView加载HTML来实现 抽屉样式的显示隐藏特效可以使用jQuery来实现,一个函数就可以搞定 实现 集成jQuery 网页中需要使用到jQuery,最新版本可以去官网下载 http://jquery.c

  • jQuery基于闭包实现的显示与隐藏div功能示例

    本文实例讲述了jQuery基于闭包实现的显示与隐藏div功能.分享给大家供大家参考,具体如下: <div class="binds"> <div class="phonebind"> <h3>手机绑定</h3> <p>当前手机号码:<span id="oldPhone">$!{user.phone}</span><input type="butto

  • jquery实现点击按钮显示与隐藏效果

    jquery实现点击按钮显示与隐藏效果

    本文实例为大家分享了jquery实现点击按钮显示与隐藏的具体代码,供大家参考,具体内容如下 首先来看实现效果 用jquery来实现这种效果是非常简单的 html <div class="bottom">       <ul>         <li class="active">            <span class="iconfont icon-yemian-copy-copy"><

  • JS实现点击复选框变更DIV显示状态的示例代码

    首先是页面上: <div class="row cl"> <label class="form-label col-xs-4 col-sm-3" style="width: 20%"><span class="c-red">*</span>是否存在促销活动:</label> <div class="formControls col-xs-8 col-s

  • jstree中的checkbox默认选中和隐藏示例代码

    jstree复选框自定义显示隐藏和初始化默认选中 首先需要配置 Checkbox plugin "plugins" : ['checkbox'] 设置默认选中状态(checkbox 选中) state: {checked: true} $.jstree.defaults.checkbox.tie_selection 示例: $('#demo_tree').jstree({ "core" : { 'data': [ { "id" : "a

随机推荐