把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 相关文章推荐
JQuery 插件模板 制作jquery插件的朋友可以参考下
Mar 17 Javascript
Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)
Apr 02 Javascript
关于JS管理作用域的问题
Apr 10 Javascript
javascript创建数组之联合数组的使用方法示例
Dec 26 Javascript
原生javascript实现拖动元素示例代码
Sep 01 Javascript
jquery实现用户打分评分特效
May 28 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
Jul 27 Javascript
Bootstrap框架动态生成Web页面文章内目录的方法
May 12 Javascript
js 调用百度分享功能
Feb 27 Javascript
JavaScript 程序错误Cannot use 'in' operator to search的解决方法
Jul 10 Javascript
一个小时快速搭建微信小程序的方法步骤
Apr 15 Javascript
JS实现可用滑块滑动的缓动图代码
Sep 01 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
全国FM电台频率大全 - 12 安徽省
2020/03/11 无线电
PHP has encountered an Access Violation
2007/01/15 PHP
php数组函数序列之array_intersect() 返回两个或多个数组的交集数组
2011/11/10 PHP
Javascript代码混淆综合解决方案-Javascript在线混淆器
2006/12/18 Javascript
How to Auto Include a Javascript File
2007/02/02 Javascript
js比较和逻辑运算符的介绍
2013/03/10 Javascript
jQuery插件PageSlide实现左右侧栏导航菜单
2015/04/12 Javascript
Grunt入门教程(自动任务运行器)
2015/08/06 Javascript
vue实现一个移动端屏蔽滑动的遮罩层实例
2017/06/08 Javascript
Hexo已经看腻了,来手把手教你使用VuePress搭建个人博客
2018/04/26 Javascript
Vue中util的工具函数实例详解
2019/07/08 Javascript
小程序如何写动态标签的实现方法
2020/02/05 Javascript
[06:21]2014DOTA2国际邀请赛 庆祝VG首阶段领跑;B叔为挣牛排半夜整理情报
2014/07/13 DOTA
[54:30]Liquid vs Newbee 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
Python、Javascript中的闭包比较
2015/02/04 Python
python爬虫入门教程--利用requests构建知乎API(三)
2017/05/25 Python
python 通过类中一个方法获取另一个方法变量的实例
2019/01/22 Python
对python中各个response的使用说明
2020/03/28 Python
详解HTML5中的拖放事件(Drag 和 drop)
2016/11/14 HTML / CSS
中东地区为妈妈们提供一切的头号购物目的地:Sprii
2018/05/06 全球购物
印度化妆品购物网站:Nykaa
2018/07/22 全球购物
澳大利亚足球鞋和服装购物网站:Ultra Football
2018/10/11 全球购物
英国屋顶用品和材料超市:Roofing Supplies UK
2019/08/24 全球购物
英国在线玫瑰专家:InterRose
2019/12/01 全球购物
自学考试自我鉴定范文
2013/09/26 职场文书
公务员转正考察材料
2014/02/07 职场文书
小学数学教学经验交流材料
2014/05/22 职场文书
2014年党员整改措施范文
2014/09/21 职场文书
批评与自我批评范文
2014/10/15 职场文书
践行党的群众路线心得体会
2014/11/05 职场文书
2014年党的群众路线学习心得体会
2014/11/05 职场文书
2014年班干部工作总结
2014/11/25 职场文书
2015年大学生党员承诺书
2015/04/27 职场文书
探讨Java中的深浅拷贝问题
2021/06/26 Java/Android
mysql 数据插入优化方法之concurrent_insert
2021/07/01 MySQL
Nginx报错104:Connection reset by peer问题的解决及分析
2022/07/23 Servers