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 列表双向选择器之改进版
Aug 09 Javascript
jquery Ajax 实现加载数据前动画效果的示例代码
Feb 07 Javascript
js数值和和字符串进行转换时可以对不同进制进行操作
Mar 05 Javascript
node.js中的socket.io的广播消息
Dec 15 Javascript
JavaScript中的fontsize()方法使用详解
Jun 08 Javascript
jqGrid用法汇总(全经典)
Jun 28 Javascript
JavaScript 函数的定义-调用、注意事项
Apr 16 Javascript
layui前段框架日期控件使用方法详解
May 19 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 jQuery
koa2使用ejs和nunjucks作为模板引擎的使用
Nov 27 Javascript
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
Mar 19 jQuery
浅谈es6中的元编程
Dec 01 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
在PHP中操作Excel实例代码
2010/04/29 PHP
PHP中new static()与new self()的区别异同分析
2014/08/22 PHP
PHP CURL 内存泄露问题解决方法
2015/02/12 PHP
php的4种常用运行方式详解
2016/12/22 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
PHP命名空间(namespace)原理与用法详解
2019/12/11 PHP
基于jQuery的动态表格插件
2011/03/28 Javascript
基于JQuery的动态删除Table表格的行和列的代码
2011/05/12 Javascript
javascript开发技术大全-第1章javascript概述
2011/07/03 Javascript
jQuery下通过replace字符串替换实现大小图片切换
2012/05/22 Javascript
关于JavaScript中的关联数组分析
2013/04/09 Javascript
基于javascript实现判断移动终端浏览器版本信息
2014/12/09 Javascript
jQuery Validate验证框架经典大全
2015/09/23 Javascript
AngularJS 输入验证详解及实例代码
2016/07/28 Javascript
微信小程序开发之IOS和Android兼容的问题
2017/09/26 Javascript
html中通过JS获取JSON数据并加载的方法
2017/11/30 Javascript
vue+swiper实现侧滑菜单效果
2017/12/28 Javascript
使用Angular CLI进行Build(构建)和Serve详解
2018/03/24 Javascript
vuecli项目构建SSR服务端渲染的实现
2020/10/30 Javascript
JS实现纸牌发牌动画
2021/01/19 Javascript
python开发之文件操作用法实例
2015/11/13 Python
Python利用Beautiful Soup模块搜索内容详解
2017/03/29 Python
安装Python和pygame及相应的环境变量配置(图文教程)
2017/06/04 Python
python使用正则表达式替换匹配成功的组
2017/11/17 Python
Python绘制七段数码管实例代码
2017/12/20 Python
使用Python进行AES加密和解密的示例代码
2018/02/02 Python
python绘制简单彩虹图
2018/11/19 Python
Spring Boot中使用IntelliJ IDEA插件EasyCode一键生成代码详细方法
2020/03/20 Python
python 利用Pyinstaller打包Web项目
2020/10/23 Python
python获得命令行输入的参数的两种方式
2020/11/02 Python
Python web框架(django,flask)实现mysql数据库读写分离的示例
2020/11/18 Python
css3 给页面加个半圆形导航条主要利用旋转和倾斜样式
2014/02/10 HTML / CSS
印度在线购物网站:Paytmmall
2019/07/24 全球购物
教师正风肃纪剖析材料
2014/10/20 职场文书
领导参观欢迎词
2015/01/26 职场文书
杨善洲观后感
2015/06/04 职场文书