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 imgareaselect 使用利用js与程序结合实现图片剪切
Jul 30 Javascript
javascript算法题 求任意一个1-9位不重复的N位数在该组合中的大小排列序号
Jul 21 Javascript
js如何判断用户是否是用微信浏览器
Jun 05 Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
Dec 02 Javascript
解析JavaScript面向对象概念中的Object类型与作用域
May 10 Javascript
使用jquery提交form表单并自定义action的方法
May 25 Javascript
Vue.js实现分页查询功能
Nov 15 Javascript
vue 实现axios拦截、页面跳转和token 验证
Jul 17 Javascript
详细介绍解决vue和jsp结合的方法
Feb 06 Javascript
JavaScript创建表格的方法
Apr 13 Javascript
es6数组之扩展运算符操作实例分析
Apr 25 Javascript
如何使用JavaScript策略模式校验表单
Apr 29 Javascript
[原创]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
用Zend Encode编写开发PHP程序
2010/02/21 PHP
php类的扩展和继承用法实例
2015/06/20 PHP
php文件上传类完整实例
2016/05/14 PHP
PHP生成静态HTML文档实现代码
2016/06/23 PHP
解决出现SoapFault (looks like we got no XML document)的问题
2017/06/24 PHP
PHP运用foreach神奇的转换数组(实例讲解)
2018/02/01 PHP
jQueryUI如何自定义组件实现代码
2010/11/14 Javascript
Jquery显示、隐藏元素以及添加删除样式
2013/08/09 Javascript
使用JavaScript+canvas实现图片裁剪
2015/01/30 Javascript
js实现发送验证码后的倒计时功能
2015/05/28 Javascript
巧用jQuery选择器提高写表单效率的方法
2016/08/19 Javascript
js基本算法:冒泡排序,二分查找的简单实例
2016/10/08 Javascript
微信小程序 loading(加载中提示框)实例
2016/10/28 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
2016/12/12 Javascript
js正则表达式惰性匹配和贪婪匹配用法分析
2016/12/26 Javascript
angular双向绑定模拟探索
2016/12/26 Javascript
Nodejs基于LRU算法实现的缓存处理操作示例
2017/03/17 NodeJs
基于Vue2.X的路由和钩子函数详解
2018/02/09 Javascript
微信小程序实现评论功能
2018/11/28 Javascript
微信小程序实现音乐播放器
2019/11/20 Javascript
Python中分数的相关使用教程
2015/03/30 Python
python在不同层级目录import模块的方法
2016/01/31 Python
python通过getopt模块如何获取执行的命令参数详解
2017/12/29 Python
python3之模块psutil系统性能信息使用
2018/05/30 Python
python实现拼图小游戏
2020/02/22 Python
Python爬虫入门有哪些基础知识点
2020/06/02 Python
python request 模块详细介绍
2020/11/10 Python
美国祛痘、抗衰老药妆品牌:Murad
2016/08/27 全球购物
OSPF有什么优点?为什么OSPF比RIP收敛快?
2013/02/13 面试题
解释下列WebService名词:WSDL、SOAP、UDDI
2012/06/22 面试题
党员年终民主评议的自我评价
2013/11/05 职场文书
美术师范毕业生自荐信
2013/11/16 职场文书
2014县委书记党的群众路线教育实践活动对照检查材料思想汇报
2014/09/22 职场文书
2014年个人债务授权委托书范本
2014/09/22 职场文书
如何在CSS中绘制曲线图形及展示动画
2021/05/24 HTML / CSS
Windows server 2012 NTP时间同步的实现
2022/06/25 Servers