把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 相关文章推荐
一样的table?不一样的table(可编辑状态table)
Sep 19 Javascript
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
Aug 06 Javascript
jQuery实现鼠标划过展示大图的方法
Mar 09 Javascript
简单实现jQuery进度条轮播实例代码
Jun 20 Javascript
原生JS实现网络彩票投注效果
Sep 25 Javascript
JavaScript数组复制详解
Feb 02 Javascript
详解Vue方法与事件
Mar 09 Javascript
Vue官网todoMVC示例代码
Jan 29 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
理理Vue细节(推荐)
Apr 16 Javascript
js获取浏览器地址(获取第1个斜杠后的内容)
Sep 03 Javascript
Vue+Vant 图片上传加显示的案例
Nov 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
《Re:从零开始的异世界生活 冰结之绊》
2020/04/09 日漫
PHP实现图片简单上传
2006/10/09 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
Linux系统下使用XHProf和XHGui分析PHP运行性能
2015/12/08 PHP
yii2控制器Controller Ajax操作示例
2016/07/23 PHP
php把文件设置为插件的技巧方法
2020/02/03 PHP
UserData用法总结 lanyu出品
2010/07/01 Javascript
解析img图片没找到onerror事件 Stack overflow at line: 0
2013/12/23 Javascript
js jquery分别实现动态的文件上传操作按钮的添加和删除
2014/01/13 Javascript
node.js中的querystring.stringify方法使用说明
2014/12/10 Javascript
jQuery的one()方法用法实例
2015/01/19 Javascript
jquery实现隐藏在左侧的弹性弹出菜单效果
2015/09/18 Javascript
浅谈addEventListener和attachEvent的区别
2016/07/14 Javascript
JavaScript中双符号的运算详解
2017/03/12 Javascript
浅谈Vue网络请求之interceptors实际应用
2018/02/28 Javascript
vue webpack打包后图片路径错误的完美解决方法
2018/12/07 Javascript
教你搭建按需加载的Vue组件库(小结)
2019/07/29 Javascript
layer弹出层扩展主题的方法
2019/09/11 Javascript
解决layer 动态加载select 失效的问题
2019/09/18 Javascript
Vue.js中使用Vuex实现组件数据共享案例
2020/07/31 Javascript
Vue跨域请求问题解决方案过程解析
2020/08/07 Javascript
Python文件操作类操作实例详解
2014/07/11 Python
Django中的ajax请求
2018/10/19 Python
Python通过for循环理解迭代器和生成器实例详解
2019/02/16 Python
基于Python获取城市近7天天气预报
2019/11/26 Python
使用CSS3设计地图上的雷达定位提示效果
2016/04/05 HTML / CSS
Infababy英国:婴儿推车、Travel System婴儿车和婴儿汽车座椅销售
2018/05/23 全球购物
总监职责范文
2013/11/09 职场文书
保洁主管岗位职责
2013/11/20 职场文书
大队干部竞选演讲稿
2014/04/28 职场文书
党的群众路线教育实践活动个人承诺书
2014/05/22 职场文书
2014年小学英语教师工作总
2014/12/03 职场文书
志愿者服务活动总结报告
2015/05/06 职场文书
幼儿园小班开学寄语
2015/05/27 职场文书
Centos7中MySQL数据库使用mysqldump进行每日自动备份的编写
2021/08/02 MySQL
MongoDB日志切割的三种方式总结
2021/09/15 MongoDB