把input初始值不写value的具体实现方法


Posted in Javascript onJuly 04, 2013

1.用<span>标签写,定位在input上,让它单击和input获焦上都消失。

比如制作一个最常见的,input初始值,一般以前,我都只是写在input的value里。但是某天开发说,这不行,会传值七七八八%……@剩下的只能意会不能言传了。所以,要把初始值单独写出来,于是我比较傻逼,就用<span>标签写,定位在input上,让它单击和input获焦上都消失。

一定要牢牢记住的单词。网上那堆,如果你看都不看就直接制作过来用的话,你就特么的是全天下最特么傻逼的人了!!我现在打字双手还在颤抖,实在无法原谅自己,那么微小的错误。对于一个懒人,又笨人。还是把正确的单词放在自己能想得到的地方吧。

previousSibling 查找前一节点。

nextSibling 查找下一节点。

html

<label class="password"> 
<span class="passText" onClick="CHECKON.hide(this,oldpwd)" id="oldPass">原密码</span> 
<input type="password" name="oldpwd" id="oldpwd" onfocus="CHECKON.showHelpInfo(this);" class="text" autocomplete="off" /> 
</label> 
css .password{ position:relative; } 
.passText{ position:absolute; left:5px; top:0px; color:#a9a9a9; font-size:14px;}

js,注意那个长长长长长长长的单词!!!!!再拼错就剁手。

var CHECKON={ 
showHelpInfo:function(idTa){ 
var pve=(idTa.previousSibling.nodeType==1)?idTa.previousSibling:idTa.previousSibling.previousSibling; 
pve.style.display='none' 
}, 
hide:function(classN,id2){ 
var idBox=document.getElementById(id2); 
classN.style.display='none'; 
idBox.focus(); 
} 
}

2.用背景图片的方式,给input添加背景图片,当获焦时,让图片消失。

3.html5里有个最新属性,placeholder属性,它会自觉出现在input里,并以灰色呈现。但是只在input输入时才会消失。 But html5,你懂的,ie8啥的不支持。

以上还有一个问题,就是浏览器会把之前的已经输入的记录记着,当再次打开登录页面时,帐号密码就出自觉出现。是当然是好事。but,对于之前设置的span标签定位的方法来说,就会出现 重影。

如果用背景图,是基本能解决,但,ie7不行。

在head头中加上了如下代码,即清除掉之前缓存登录记录:

<meta http-equiv= "Pragma" content= "no-cache" /> 
<meta http-equiv= "Cache-Control" content= "no-cache" /> 
<meta http-equiv= "Expires" content= "0" />
Javascript 相关文章推荐
js 表格隔行颜色
Dec 02 Javascript
jQuery 表单验证扩展代码(一)
Oct 11 Javascript
jQuery页面滚动浮动层智能定位实例代码
Aug 23 Javascript
js实现文本框中焦点在最后位置
Mar 04 Javascript
js实现iframe自动自适应高度的方法
Feb 17 Javascript
jQuery控制cookie过期时间的方法
Apr 07 Javascript
JavaScript版经典游戏之扫雷游戏完整示例【附demo源码下载】
Dec 12 Javascript
利用JQuery操作iframe父页面、子页面的元素和方法汇总
Sep 10 jQuery
Vue filter介绍及详细使用
Apr 04 Javascript
JavaScript实现一个带AI的井字棋游戏源码
May 21 Javascript
小程序获取周围IBeacon设备的方法
Oct 31 Javascript
用node开发并发布一个cli工具的方法步骤
Jan 03 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
Jul 04 #Javascript
简单实用jquery版三级联动select示例
Jul 04 #Javascript
原生javascript和jquery判断浏览器版本等信息
Jul 04 #Javascript
js将控件隐藏的方法及display属性介绍
Jul 04 #Javascript
Jquery多选框互相内容交换的实例代码
Jul 04 #Javascript
js局部刷新页面时间具体实现
Jul 04 #Javascript
Jquery倒数计时按钮setTimeout的实例代码
Jul 04 #Javascript
You might like
通过文字传递创建的图形按钮
2006/10/09 PHP
php文件上传的简单实例
2013/10/19 PHP
PHP 5.5 创建和验证哈希最简单的方法详解
2013/11/07 PHP
php生成zip文件类实例
2015/04/07 PHP
培养自己的php编码规范
2015/09/28 PHP
PHP内部实现打乱字符串顺序函数str_shuffle的方法
2019/02/14 PHP
Javascript日期对象的dateAdd与dateDiff方法
2008/11/18 Javascript
基于jquery的图片的切换(以数字的形式)
2011/02/14 Javascript
javascript采用数组实现tab菜单切换效果
2012/12/12 Javascript
各种页面定时跳转(倒计时跳转)代码总结
2013/10/24 Javascript
Jquery uploadify图片上传插件无法上传的解决方法
2013/12/16 Javascript
html5+javascript实现简单上传的注意细节
2016/04/18 Javascript
js控件Kindeditor实现图片自动上传功能
2020/07/20 Javascript
JavaScript编程中实现对象封装特性的实例讲解
2016/06/24 Javascript
js css实现垂直方向自适应的三角提示菜单
2016/06/26 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
原生JS实现网页手机音乐播放器 歌词同步播放的示例
2018/02/02 Javascript
layer.close()关闭进度条和Iframe窗的方法
2018/08/17 Javascript
微信小程序实现发送验证码按钮效果
2018/12/20 Javascript
Vue动画事件详解及过渡动画实例
2019/02/09 Javascript
LayUI动态设置checkbox不显示的解决方法
2019/09/02 Javascript
[02:22]2018DOTA2亚洲邀请赛VG赛前采访
2018/04/03 DOTA
[13:55]Newbee vs Team Spirit
2018/06/07 DOTA
pyinstaller打包多个py文件和去除cmd黑框的方法
2019/06/21 Python
Django框架表单操作实例分析
2019/11/04 Python
Python Tornado批量上传图片并显示功能
2020/03/26 Python
canvas里面如何基于随机点绘制一个多边形的方法
2018/06/13 HTML / CSS
Kathmandu英国网站:新西兰户外运动品牌
2017/03/27 全球购物
印度服装购物网站:Limeroad
2018/09/26 全球购物
商务经理岗位职责
2014/08/03 职场文书
2014年党员发展工作总结
2014/12/02 职场文书
建筑安全员岗位职责
2015/02/15 职场文书
保研导师推荐信
2015/03/25 职场文书
奖励申请报告范文
2015/05/15 职场文书
经费申请报告范文
2015/05/18 职场文书
Python基础之操作MySQL数据库
2021/05/06 Python