IE10-浏览器实现placeholder效果】的更多相关文章

placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于以下类型的 input 标签:text, search, url, telephone, email 以及 password. 我们先看下在谷歌浏览器中的效果,如图所示: 获得焦点时: 输入字段: 因为是 html5 属性,自然低版本的浏览器比如 ie6-8 不兼容.下面就介绍下如何在低版本浏览器中…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery实现IE浏览器兼容placeholder效果</title> <style type="text/css"> * { margin: 0; padding: 0; } .input { width: 200px;…
曾经遇到这样一个问题,处理IE8密码框placeholder属性兼容性.几经周折,这个方案是可以解决问题的. 1.jsp页面引入js插件 <script type="text/javascript" src="<%=basePath%>/placeholder.js" ></script> 2.页面初始化代码 <script type="text/javascript"> //input提示信息 效…
/* ** jQuery版本:jQuery-1.8.3.min.js ** 测试的浏览器:IE8,IETester下的IE6-IE9** Author:博客园小dee */ placeholder是HTML5<input>的属性之一,在不同的浏览器( 支持HTML5的现代浏览器 )中会有略微不同的显示效果: 在Chrome( v31.0.1650.63 m).Firefox( v21.0 ).360安全( v6.3 极速模式 )中,输入栏获得焦点后,提示文字并不消失,如图( Chrome ):…
jQuery EnPlaceholder plug (兼容IE浏览器的placeholder)使用 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年9月8日 14:24:47 星期二 http://fanshuyao.iteye.com/ enpla…
页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" placeholder="请输入用户名" value="" id="username"/> 最多加点样式控制下默认文字的颜色 input::-webkit-input-placeholder{color:#AAAAAA;} 但是在低版本的浏览器却不支…
placeholder是html5<input>的一个属性,它提供可描述输入字段预期值的提示信息(hint), 该提示会在输入字段为空时显示.高端浏览器支持此属性(ie10/11在获得焦点时文字消失),ie6/7/8/9则不支持.为了兼容各主流浏览器并使其呈现效果保持一致,以下三套方案仅供参考. 方案一: 摒弃原始属性placeholder,为input添加一个兄弟节点span,并为span设置绝对定位(父节点为position: relative;),使其位于input之上. html代码片…
如下图,在文本框为空时显示提示文字 在IE10+和chrome浏览器加placeholder属性及可实现 ,单在IE10-浏览器并不支持该属性, 以下是placeholder在IE10-浏览器的实现 <style type="text/css"> /*输入框为空时提示文字的样式*/ label.placeholder { color: gray; padding-left: 3px; cursor: text; z-index: 1000; position: absolu…
转自来源 : http://www.ifrans.cn/placehoder/ 跨浏览器的placeholder – 原生JS版 html5为input元素新增了一个属性”placeholder”,提供对输入字段预期值的提示信息,input为空且未获得焦点时显示,获得焦点时消失,非常实用.目前,大部分现代浏览器都对placeholder属性提供了支持,IE10也是支持的.如果需要使IE6~IE9等浏览器支持placeholder,只有借助js了. 在这些不支持原生placeholder属性的浏览…
<!doctype html><html><head><meta charset="utf-8"><title>placeholder 效果的实现</title><script src="http://code.jquery.com/jquery-1.10.1.min.js"></script></head><style>body {       …