JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果
作者:bea
本文实例讲述了JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果。分享给大家供大家参考,具体如下: 思路: 1、首先用把密码框用txt暂时替代,并赋上默认值 <input type="text" value="请输入密码" /> 2、当文本框获取焦点后,把默认值清空,把type改为password。 3、当文本框失去焦点后,把type改为txt,把默认值设为“请输入密码”。 JS代码: window.onload=function(){ var in
本文实例讲述了JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果。分享给大家供大家参考,具体如下:
思路:
1、首先用把密码框用txt暂时替代,并赋上默认值 <input type="text" value="请输入密码" /> 2、当文本框获取焦点后,把默认值清空,把type改为password。 3、当文本框失去焦点后,把type改为txt,把默认值设为“请输入密码”。
JS代码:
window.onload=function(){
var input=document.getElementById('input');
input.onfocus=function(){
if(this.value=='请输入密码'){
this.value='';
this.type='password';
};
};
input.onblur=function(){
if(!this.value){
this.type = 'text';
this.value = '请输入密码';
};
};
};
HTML代码:
代码如下:
<input type="text" value="请输入密码" id="input" />
PS:这里再为大家推荐一款非常好用的JavaScript压缩、格式化与加密工具,功能非常强大(对于想让代码加密的朋友不妨试试这里的js加密功能):
JavaScript压缩/格式化/加密工具:http://tools./code/jscompress
另外,上面这款js工具中的加密使用的是eval函数加密形式,对此本站还提供了如下这款针对eval函数加密的解密工具,非常强大实用!
js的eval方法在线加密解密工具:http://tools./password/evalencode
希望本文所述对大家JavaScript程序设计有所帮助。
有用 | 无用
思路:
1、首先用把密码框用txt暂时替代,并赋上默认值 <input type="text" value="请输入密码" /> 2、当文本框获取焦点后,把默认值清空,把type改为password。 3、当文本框失去焦点后,把type改为txt,把默认值设为“请输入密码”。
JS代码:
window.onload=function(){
var input=document.getElementById('input');
input.onfocus=function(){
if(this.value=='请输入密码'){
this.value='';
this.type='password';
};
};
input.onblur=function(){
if(!this.value){
this.type = 'text';
this.value = '请输入密码';
};
};
};
HTML代码:
代码如下:
<input type="text" value="请输入密码" id="input" />
PS:这里再为大家推荐一款非常好用的JavaScript压缩、格式化与加密工具,功能非常强大(对于想让代码加密的朋友不妨试试这里的js加密功能):
JavaScript压缩/格式化/加密工具:http://tools./code/jscompress
另外,上面这款js工具中的加密使用的是eval函数加密形式,对此本站还提供了如下这款针对eval函数加密的解密工具,非常强大实用!
js的eval方法在线加密解密工具:http://tools./password/evalencode
希望本文所述对大家JavaScript程序设计有所帮助。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 谈谈jQuery Ajax用法详解
- JavaScript中使用sencha gridpanel 编辑单元格、改变单元格颜色
- 基于jquery实现全屏滚动效果
- javascript给span标签赋值的方法
- 谈谈javascript中使用连等赋值操作带来的问题
- jQuery实现的AJAX简单弹出层效果代码
- js检测iframe是否加载完成的方法
- 学习JavaScript设计模式(策略模式)
- 深入浅析同源策略和跨域访问
- js实现iframe框架取值的方法(兼容IE,firefox,chrome等)
- 学习JavaScript设计模式(单例模式)
- javascript bom是什么及bom和dom的区别
- Javascript模仿淘宝信用评价实例(附源码)
- Javascript BOM学习小结(六)
- js实现延时加载Flash的方法
- 学习JavaScript设计模式(链式调用)
- 学习JavaScript设计模式(继承)
- js图片跟随鼠标移动代码
- 学习JavaScript设计模式(封装)