js多方框输入密码_js 如何实现密码输入时,明文显示一秒后变成密文呢?

2023-11-08

function MaskedPassword(passfield, symbol)

{

if(typeof document.getElementById == 'undefined'

|| typeof document.styleSheets == 'undefined') { return false; }

if(passfield == null) { return false; }

this.symbol = symbol;

this.isIE = typeof document.uniqueID != 'undefined';

passfield.value = '';

passfield.defaultValue = '';

passfield._contextwrapper = this.createContextWrapper(passfield);

this.fullmask = false;

var wrapper = passfield._contextwrapper;

var hiddenfield = '';

var textfield = this.convertPasswordFieldHTML(passfield);

wrapper.innerHTML = hiddenfield + textfield;

passfield = wrapper.lastChild;

passfield.className += ' masked';

passfield.setAttribute('autocomplete', 'off');

passfield._realfield = wrapper.firstChild;

passfield._contextwrapper = wrapper;

var self = this;

this.addListener(passfield, 'change', function(e)

{

self.fullmask = false;

self.doPasswordMasking(self.getTarget(e));

});

this.addListener(passfield, 'input', function(e)

{

self.fullmask = false;

self.doPasswordMasking(self.getTarget(e));

});

this.addListener(passfield, 'propertychange', function(e)

{

self.doPasswordMasking(self.getTarget(e));

});

this.addListener(passfield, 'keyup', function(e)

{

if(!/^(9|1[678]|224|3[789]|40)$/.test(e.keyCode.toString()))

{

self.fullmask = false;

self.doPasswordMasking(self.getTarget(e));

}

});

this.addListener(passfield, 'blur', function(e)

{

self.fullmask = true;

self.doPasswordMasking(self.getTarget(e));

});

this.forceFormReset(passfield);

return true;

}

MaskedPassword.prototype =

{

doPasswordMasking : function(textbox)

{

var plainpassword = '';

if(textbox._realfield.value != '')

{

for(var i=0; i

{

if(textbox.value.charAt(i) == this.symbol)

{

plainpassword += textbox._realfield.value.charAt(i);

}

else

{

plainpassword += textbox.value.charAt(i);

}

}

}

else

{

plainpassword = textbox.value;

}

var maskedstring = this.encodeMaskedPassword(plainpassword, this.fullmask, textbox);

if(textbox._realfield.value != plainpassword || textbox.value != maskedstring)

{

textbox._realfield.value = plainpassword;

textbox.value = maskedstring;

}

},

encodeMaskedPassword : function(passwordstring, fullmask, textbox)

{

var characterlimit = fullmask === true ? 0 : 1;

for(var maskedstring = '', i=0; i

{

if(i < passwordstring.length - characterlimit)

{

maskedstring += this.symbol;

}

//otherwise just copy across the real character

else

{

maskedstring += passwordstring.charAt(i);

}

}

return maskedstring;

},

createContextWrapper : function(passfield)

{

var wrapper = document.createElement('span');

wrapper.style.position = 'relative';

passfield.parentNode.insertBefore(wrapper, passfield);

wrapper.appendChild(passfield);

return wrapper;

},

forceFormReset : function(textbox)

{

while(textbox)

{

if(/form/i.test(textbox.nodeName)) { break; }

textbox = textbox.parentNode;

}

if(!/form/i.test(textbox.nodeName)) { return null; }

this.addSpecialLoadListener(function() { textbox.reset(); });

return textbox;

},

convertPasswordFieldHTML : function(passfield, addedattrs)

{

var textfield = '

for(var fieldattributes = passfield.attributes,

j=0; j

{

if(fieldattributes[j].specified && !/^(_|type|name)/.test(fieldattributes[j].name))

{

textfield += ' ' + fieldattributes[j].name + '="' + fieldattributes[j].value + '"';

}

}

textfield += ' type="text" autocomplete="off">';

return textfield;

},

limitCaretPosition : function(textbox)

{

//create a null timer reference and start function

var timer = null, start = function()

{

if(timer == null)

{

//IE uses this range stuff

if(this.isIE)

{

timer = window.setInterval(function()

{

var range = textbox.createTextRange(),

valuelength = textbox.value.length,

character = 'character';

range.moveEnd(character, valuelength);

range.moveStart(character, valuelength);

range.select();

}, 100);

}

else

{

timer = window.setInterval(function()

{

var valuelength = textbox.value.length;

if(!(textbox.selectionEnd == valuelength && textbox.selectionStart <= valuelength))

{

textbox.selectionStart = valuelength;

textbox.selectionEnd = valuelength;

}

}, 100);

}

}

},

stop = function()

{

window.clearInterval(timer);

timer = null;

};

this.addListener(textbox, 'focus', function() { start(); });

this.addListener(textbox, 'blur', function() { stop(); });

},

addListener : function(eventnode, eventname, eventhandler)

{

if(typeof document.addEventListener != 'undefined')

{

return eventnode.addEventListener(eventname, eventhandler, false);

}

else if(typeof document.attachEvent != 'undefined')

{

return eventnode.attachEvent('on' + eventname, eventhandler);

}

},

addSpecialLoadListener : function(eventhandler)

{

if(this.isIE)

{

return window.attachEvent('onload', eventhandler);

}

else

{

return document.addEventListener('DOMContentLoaded', eventhandler, false);

}

},

getTarget : function(e)

{

if(!e) { return null; }

return e.target ? e.target : e.srcElement;

}

}

setTimeout("$('pass').")

}

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

js多方框输入密码_js 如何实现密码输入时,明文显示一秒后变成密文呢? 的相关文章

随机推荐

  • 【Xgplayer】xgplayer基本使用

    文章目录 xgplayer简介 xgplayer官网 Xgplayer VS VideoJs xgplayer下载 播放器组件 使用播放器 效果图 推荐 xgplayer简介 开发团队 字节跳动 字节跳动出品 必属精品 xgplayer是一
  • VS2022编译GDAL库报错: LINK : error LNK2001: 无法解析的外部符号 _OSRValidate _OGR_G_GetPointCount _OGRRegisterAll

    目录 场景复现 解决方案 场景复现 使用VS2022的Native Tools command prompt for 2022工具编译GDAL库时 报 LINK error LNK2001 无法解析的外部符号 OSRValidate OGR
  • Pytorch入门实战(5):基于nn.Transformer实现机器翻译(英译汉)

    使用Google Colab运行 open In Colab 源码地址 文章目录 本文涉及知识点 本文内容 环境配置 数据预处理 文本分词与构造词典 Dataset and Dataloader 模型构建 模型训练 模型推理 本文涉及知识点
  • 数据库并发控制 事务调度 可串行调度

    所谓并发操作 是指在多用户共享的系统中 许多用户可能同时对同一数据进行操作 所带来的问题是数据的不一致性 具体表现为 丢失更新 不可重复读 读脏数据 1 事务调度 1 1 串行调度 Serial Schedule 是指多个事务依序串行执行
  • 华为手机上的网上邻居怎么用_HUAWEI Mate 8 网络邻居 使用教程

    本帖最后由 爱奔跑的蜗牛 于 2016 1 19 23 54 编辑 有根数据线 手机连接电脑传输管理文件算不上什么秘密 但总有那么一两天 忘记带数据线 又急需拷贝电脑文件到手机上 除了问别人借数据线 难道就不能 自力更生 了吗 当然不是 拥
  • 【华为OD机试真题 python】通信误码【2022 Q4

    题目描述 通信误码 信号传播过程中会出现一些误码 不同的数字表示不同的误码ID 取值范围为1 65535 用一个数组记录误码出现的情况 每个误码出现的次数代表误码频度 请找出记录中包含频度最高误码的最小子数组长度 输入描述 误码总数目 取值
  • Python编程的注意事项

    目录 一 异常处理 1 精细化地捕获异常 2 finally 块中的资源清理 3 抛出自定义异常 二 类的继承 1 不要过度使用继承 2 了解多重继承的问题 三 垃圾回收与内存管理 1 对象引用计数的概念 2 循环引用的问题 Python
  • Kubernetes中的PV和PVC

    K8s引入了一组叫作Persistent Volume Claim PVC 和Persistent Volume PV 的API对象 大大降低了用户声明和使用持久化Volume的门槛 在Pod的Volumes中 只要声明类型是persist
  • [1080]idea import引用报错

    从GIT上拉下代码后 出现这种情况 类正常 但是import是浅灰色 引用类有红色警告 代码中所有的引用都报错 重启idea 无效 删除引用的类与被引用的类中的代码 无效 重新加载maven 无效 最后 清理缓存后 恢复正常 File gt
  • 硬件系统工程师宝典(29)-----应用DC/DC要注意什么?

    各位同学大家好 欢迎继续做客电子工程学习圈 今天我们继续来讲这本书 硬件系统工程师宝典 上篇我们说到使用LDO时 除了要考虑输入 输出电压外 还要注意压差 最大输出电流等 今天我们来讲讲DC DC的应用分析 DC DC分类 将一个不受控的输
  • 台式电脑重装系统失败怎么办

    当大家使用一键重装系统软件给自己电脑重装系统的时候 都可能会遇到一些故障问题造成台式电脑重装系统失败的情况发生 那么大家遇到台式电脑重装系统失败怎么办呢 现在小编就教下大家相关的方法教程 大家一起来看看吧 工具 原料 系统版本 window
  • 【开源之美】nanomsg(2) :req/rep 模式

    req rep 模式显然就是类似http的应答模式 在某些基于短连接的进程间通讯方式上可以很方便的使用 下面我们举个例子 服务端 demo ifndef NANOMSGUTIL H define NANOMSGUTIL H include
  • [已解决] 数据库连接问题Error querying database. Cause: org.springframework.jdbc.CannotGetJdbcConnectionExcept...

    我在学习SSM框架做一个小demo 时遇到了这个问题 具体的报错时 Error querying database Cause org springframework jdbc CannotGetJdbcConnectionExceptio
  • 真假难辨?来看看华为云区块链怎么搞定

    怎么证明你是你 你的合同是真合同 被骗 防被骗 怎么证明自己的证据是真实的 跑路 人间蒸发 怎么还原事实维护自己的合法产权 云 5G的普遍应用与流量平面化 促使数字化资产内容爆发式增长 数字合同 知识版权 书籍 视频 音乐 个人信息等在流通
  • FFT频谱分析原理

    FFT频谱分析原理 采样定理 采样频率要大于信号频率的两倍 N个采样点经过FFT变换后得到N个点的以复数形式记录的FFT结果 假设采样频率为Fs 采样点数为N 那么FFT运算的结果就是N个复数 或N个点 每一个复数就对应着一个频率值以及该频
  • 内外网电脑远程桌面教程(win10)

    内网远程桌面连接 1 要远程的用户必须有密码 设置本机固定ip 自行百度 2 关闭防火墙与修改 在 控制面板 Windows 防火墙 启用或关闭Windows防火墙 3 打开远程桌面设置 在 桌面 计算机 上右击 打开 属性 远程设置 然后
  • linux 的configure --prefix=/

    linux configure prefix 是 编译指定程序存放路径 不指定prefix 可执行文件默认shu放在 usr local bin 库文件默认放在 usr local lib 配置文件默认放在 usr local etc 其它
  • maven deploy plugin_(转)maven内部运行原理解析(一)

    原文来源于 http www jianshu com p 0fb5e3fb704d maven至今还是Java编程语言构建的事实标准 大部分项目还在使用maven来进行构建 因此了解maven内部运行的原理对定位和分析问题还是很有裨益的 本
  • @ComponentScan配置扫描多个包

    我的Spring版本是5 2 6 使用 ComponentScan扫描多个包的注解配置 Configuration ComponentScan basePackages bean dao service public class TxCon
  • js多方框输入密码_js 如何实现密码输入时,明文显示一秒后变成密文呢?

    function MaskedPassword passfield symbol if typeof document getElementById undefined typeof document styleSheets undefin