Javascript 动态改变imput type属性


Posted in Javascript onNovember 01, 2016

Javascript 动态改变imput type属性:

代码实现:

<script type="text/javascript">
  function shoppw(thebox){
    var ps = document.getElementById('ps');
    var pass = document.getElementById('pass');
    ps.removeChild(pass);
    var psImput = document.createElement("INPUT");
    
    if(pass.type == 'password'){
      psImput.type = "text";
    } else {
      psImput.type = 'password';
    }
    psImput.id = 'pass';
    psImput.name = "password";
    psImput.maxlength="15";
    ps.appendChild(psImput);
  }
</script>

HTML代码:

<td class="label"> * <label for="password" accesskey="">登录密码:</label></td>
  <td ><div id="ps"><input type="text" name="password" maxlength="15" id="pass" /></div>
   <input name="checkbox2" type="checkbox" value="true" checked="checked" id="show" onclick="shoppw(this)" />
   <label for="show" accesskey="">显示</label></td>

 可以运行时动态改变imput元素的type属性值

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jQuery 表单验证扩展(四)
Oct 20 Javascript
jQuery的.live()和.die() 使用介绍
Sep 10 Javascript
修复ie8&amp;chrome下window的resize事件多次执行
Oct 20 Javascript
VS2008中使用JavaScript调用WebServices
Dec 18 Javascript
JavaScript从0开始构思表情插件
Jul 26 Javascript
清除浏览器缓存的几种方法总结(必看)
Dec 09 Javascript
jQuery实现简单的抽奖游戏
May 05 jQuery
vue生命周期实例小结
Aug 15 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
Aug 22 Javascript
babel7.x和webpack4.x配置vue项目的方法步骤
May 12 Javascript
Vue的生命周期操作示例
Sep 17 Javascript
vue引入Excel表格插件的方法
Apr 28 Vue.js
[原创]JavaScript语法高亮插件highlight.js用法详解【附highlight.js本站下载】
Nov 01 #Javascript
javascript 内置对象及常见API详细介绍
Nov 01 #Javascript
Vue.js组件使用开发实例教程
Nov 01 #Javascript
js调用父框架函数与弹窗调用父页面函数的简单方法
Nov 01 #Javascript
js判断出两个字符串最大子串的函数实现方法
Nov 01 #Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
Nov 01 #Javascript
JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)
Nov 01 #Javascript
You might like
wordpress之wp-settings.php
2007/08/17 PHP
php修改文件上传限制方法汇总
2015/04/07 PHP
php实现的简易扫雷游戏实例
2015/07/09 PHP
ThinkPHP模板标签eq if 中区分0,null,false的方法
2017/03/24 PHP
javascript 匿名函数的理解(透彻版)
2010/01/28 Javascript
关于Javascript与iframe的那些事儿
2013/07/04 Javascript
让编辑器支持word复制黏贴、截屏的js代码
2016/10/17 Javascript
Vue学习之路之登录注册实例代码
2017/07/06 Javascript
react-native ListView下拉刷新上拉加载实现代码
2017/08/03 Javascript
jquery tmpl模板(实例讲解)
2017/09/02 jQuery
vue组件生命周期详解
2017/11/07 Javascript
JavaScript数据结构与算法之队列原理与用法实例详解
2017/11/22 Javascript
详解使用jQuery.i18n.properties实现js国际化
2018/05/04 jQuery
JS中appendChild追加子节点无效的解决方法
2018/10/14 Javascript
antd组件Upload实现自己上传的实现示例
2018/12/18 Javascript
分享JS表单验证源码(带错误提示及密码等级)
2020/01/05 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
2020/07/11 Javascript
Python3基础之输入和输出实例分析
2014/08/18 Python
Python机器学习之SVM支持向量机
2017/12/27 Python
详解Python 函数如何重载?
2019/04/23 Python
Python实现平行坐标图的绘制(plotly)方式
2019/11/22 Python
详解python内置常用高阶函数(列出了5个常用的)
2020/02/21 Python
python+adb+monkey实现Rom稳定性测试详解
2020/04/23 Python
django模型类中,null=True,blank=True用法说明
2020/07/09 Python
PyQt5-QDateEdit的简单使用操作
2020/07/12 Python
在django中查询获取数据,get, filter,all(),values()操作
2020/08/09 Python
Python 解析库json及jsonpath pickle的实现
2020/08/17 Python
html5的自定义data-*属性与jquery的data()方法的使用
2014/07/02 HTML / CSS
three.js模拟实现太阳系行星体系功能
2019/09/03 HTML / CSS
J2EE面试题大全
2016/08/06 面试题
民生工程实施方案
2014/03/22 职场文书
高中语文课后反思
2014/04/27 职场文书
英语课前三分钟演讲稿(6篇)
2014/09/13 职场文书
Oracle笔记
2021/04/05 Oracle
Java各种比较对象的方式的对比总结
2021/06/20 Java/Android
Redis批量生成数据的实现
2022/06/05 Redis