IE678910不兼容H5的placeholder属性,需要JS解决
两种方法的思路
一、使用input的value作为显示文本
二、不使用value,添加一个额外的span标签,绝对定位覆盖到input上面。
两种方式各有优缺点,方法一占用了input的value属性,表单提交时需要一些额外的判断工作,方法二则使用了多余的标签。
placeholder=function(input){
var text=input.getAttribute('placeholder_t'),
defaultValue=input.defaultValue;
if(defaultValue==''){
input.value=text;
input.style.color='#c0c0c0';
}
input.onfocus=function(){
if(input.value===text)
{
this.value='';
input.style.color='#000000';
}
};
input.onblur=function(){
if(input.value===''){
this.value=text;
input.style.color='#c0c0c0';
}
}
} placeholder(document.getElementById("slbh"));
placeholder(document.getElementById("cxmm"));
IE678910不兼容H5的placeholder属性,需要JS解决的更多相关文章
- [干货]兼容HTML5的Placeholder属性-更新版v0.10102013
HTML5对Web Form做了许多增强,比如input新增的type类型.Form Validation等.Placeholder是HTML5新增的另一个属性,当input或者textarea设置了 ...
- ie8不兼容input的placeholder属性但是要实现其效果的方法
通过学习前辈的思想,个人想法整理如下: 通过两个元素标签,仿造出placeholder的内容 使用position定位好两个元素标签 第一要隐藏两个元素标签display:none,在<!--[ ...
- 修复IE9.0下PlaceHolder 属性问题js脚本
在开发前端系统时候碰到这种兼容问题,以下是个人解决方案,希望能给其他人带来帮助: var JPlaceHolder = { //检测 _check: function () { return 'pla ...
- 兼容ie10以下版本的placeholder属性
<script src="${ctx }/js/jquery.placeholder.js" type="text/javascript">< ...
- placeholder属性兼容ie8
<!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...
- IE如何兼容placeholder属性
在前端开发中,经常需要为input设置placeholder属性,但是placeholder是HTML5新属性,在IE10以下不兼容,那么如何完美兼容呢? 网上搜索了一下,其实也挺简单的,可以采用以下 ...
- input 的 placeholder属性在IE8下的兼容处理
placeholder是input标签的新属性,在使用的时候有两个问题: 1.IE8 下不兼容 处理思路: 如果浏览器不识别placeholder属性,给input添加类名placeholder,模仿 ...
- 改进《完美让IE兼容input placeholder属性的jquery实现》的不完美
<完美让IE兼容input placeholder属性的jquery实现>中的代码在IE9以下浏览器中会出错,原因是因为ie9以下的浏览器对input的标签的解释不同. 例如对以下文本框的 ...
- HTML5表单提示placeholder属性兼容IE
placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 <inpu ...
随机推荐
- c#帮助类:发送邮件
private static string IsOpenSendMail = ConfigurationManager.AppSettings["IsOpenSendMail"]; ...
- 关于bootstrap模态框的初始化事件
转:https://blog.csdn.net/u010181136/article/details/77579823
- LoadRunner--获取请求的返回结果函数
注:内容来自网络 Action(){ web_set_max_html_param_len("262144"); // 默认最大长度为256 web_reg_save_param( ...
- 灯塔AOI简易实现
首先我们来讨论下游戏开发中的几个坐标系,为了方便解释,我截取了灯塔AOI DEMO当NPC数目为0时候的样子(代码地址觉得有帮助的童鞋记得给我代码点个星^_^) 先对这张图简单说明下: 蓝色的坐标轴表 ...
- (一)用C或C ++扩展(翻译)
用C或C ++扩展 如果你知道如何用C语言编程,那么为Python添加新的内置模块是很容易的.这种扩展模块可以做两件不能直接在Python中完成的事情:它们可以实现新的内置对象类型,以及调用C库函数和 ...
- iOS开发系统类功能划分
0.OC语法基础 CHOCBase Object C语法学习笔记(一) Object C语法学习笔记(二) 1.UI类 自定义控件程序运行流程 setNeedsLayOut和setNeedsDispl ...
- ios app提交之前需要哪几个证书
1.遇到的问题 一款App在别人的机器上开发和发布,现在迭代更新和开发需要在一台新mac机上开发和发布. (使用同一个开发者账号)问题: 1.在新mac机器上开发并导入真机测试,是不是需要从别人的机器 ...
- centos 在vm下网络不通
VMware是一款虚拟机,支持各种热门系统,我们可以在VMware虚拟机中安装其他系统以满足个人需求,但在为VMware安装CentOS6.5后,无法连接网络,这是什么原因导致的呢?下面就给大家介绍下 ...
- select展开时 重新加载 option,ie 折叠问题 以及 chrome 没有变化问题
这个bug是因为浏览器的渲染问题引起的 一:重新加载option的渲染处理 1:火狐能重新渲染,并且select不折叠 2:ie重新渲染,但是select收缩折叠 3:chrome直接不重新进行渲染, ...
- Sublime的一些问题记录
1.默认的中文字体显示异常(参考:关于最新版的Sublime Text 3中默认的中文字体样式显示异常的问题) 1. 选择Perferences(首选项)--> settings(设置) 2. ...