Javascript 动态改变imput type属性

2024-03-26 18:34:01

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属性值

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

浅谈js对象属性通过点(.) 和方括号([]) 的不同之处

[JS对象属性的查询和设置] 可以通过点(.) 或方括号([]) 运算符来获取属性的值.运算符左侧应当是一个表达式,它返回一个对象.对于点(.)来说,右侧必须是一个以属性名称命名的简单标识符.对于方括号([])来说,方括号里必须是一个计算结果为字符串的表达式,这个字符串就是属性的名字: <script type="text/javascript"> var author = book.author; //得到book的"author"属性 var na
在html中引入外部js文件,并调用带参函数的方法

在html中引入外部js文件,并调用js文件中的带参函数 1 项目结构 2 编写a.js.test.html //a.js function abc(str){ alert(str); } //test.html <html> <head> <script type="text/javascript" src="a.js"></script> <script type="text/javascript&
python 把数据 json格式输出的实例代码

有个要求需要在python的标准输出时候显示json格式数据,如果缩进显示查看数据效果会很好,这里使用json的包会有很多操作 import json date = {u'versions': [{u'status': u'CURRENT', u'id': u'v2.3', u'links': [{u'href': u'http://controller:9292/v2/', u'rel': u'self'}]}, {u'status': u'SUPPORTED', u'id': u'v2.2'
jsp 网站引入外部css或者js失效问题解决

最近做项目,完成项目经理布置的任务,开始入门java web,但在开发过程中遇到过许许多多的问题,但是令我最头痛的还是导入外部css一直失效,困扰许久才找出原因. 路径问题 css或者js导入失效最有可能的原因就是路径错误,这里我给出我的网站目录结构,大家可以参考下. 导入css代码: <link rel="stylesheet" type="text/css" href="css/login.css"> 记得jsp头部需要设置相对路
js模式化窗口问题![window.dialogArguments]

前些天做项目时遇到了个浏览器兼容问题,解决后记录一下,也将模式化的资料放上! 详细问题描述: 在火狐浏览器中弹出一个子窗口,子页面中是一个分页,点下一页后子页面会刷新,然后window.dialogArguments对象就丢失了,alert输出显示undefined [解决方法见第三项] 最近做网站的时候需要用到模式化窗口功能,也遇到了一些问题,所以查了查资料以解决 1.弹出窗口几种方法: a.window.open(pageURL,name,parameters); b.window.show
原生js代码实现图片放大境效果

今天我给大家分享一下自己用js写的一个图片放大器效果,我做了两种效果的放大,其实它们的原理都差不多,都是采用了两张图片给两张图片设定相应的尺寸,最后显示在不同位置,最终实现放大效果. 第一种是我仿照淘宝购物页面的一个放大镜效果,当鼠标移动到商品图片上时,图片上会出现一个矩形区域,而这个区域就是你要放大的区域,然后商品图片的右侧会出现一个放大后的商品图片.这种放大方式只需要你计算好放大的比例,然后通过修改放大区域的scrollLeft和scrollTop值实现相应的放大效果. <!DOCTYPE
浅谈js继承的实现及公有、私有、静态方法的书写

今天没事的时候,研究了一下JS继承的实现,下面是html的源码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS类的继承的实现</title> <script type="text/JavaScript"> //定义父类及公有.私有.静态属性及方法 function parent(){ var pname
js基础之DOM中document对象的常用属性方法详解

-----引入每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1 document.anchors 返回对文档中所有 Anchor 对象的引用.还有document.links/document.forms/document.images等 2 document.URL 返回当前文档的url 3 document.title 返回当前文档的标题 4 do
js学习笔记之事件处理模型

在各种浏览器中存在四种事件模型:原始事件模型.标准事件模型.IE事件模型,还有一种Netscape4事件模型,下面具体介绍一下. 1.目前共存在四种事件处理模型分别是:原始事件模型.标准事件模型.IE事件模型,还有一种Netscape4事件模型,但基本可忽略 2.事件处理模型又可以分为基本事件处理和高级事件处理两种,原始事件模型属于基本事件处理,标准事件模型和IE事件模型属于高级事件处理一.基本事件处理: 基本事件处理主要是指原始事件模型实现的事件处理.其主要分为以下两种: (1).作为HTM
JS给Array添加是否包含字符串的简单方法

JS的Array类型,本身并没有是否包含某个字符串的方法,下面的代码实现了此功能,有需要的同学可以看一下: Array.prototype.contains = function(v){ var b = false; for(var i=0;i<this.length;i++){ if(this[i] == v){ b = true; break; } } return b; }; 以上就是小编为大家带来的JS给Array添加是否包含字符串的简单方法全部内容了,希望大家多多支持我们~

Javascript 动态改变imput type属性

相关推荐

随机推荐