ie8 下怎样改变ie8不支持placeholderr 颜色

来源：蜘蛛抓取(WebSpider) 时间：2016-08-16 05:57 标签： ie8支持placeholder
在IE8中如何解决placeholder的兼容问题？_问答_ThinkSAAS
在IE8中如何解决placeholder的兼容问题？
在IE8中如何解决placeholder的兼容问题？
问题详情: 想实现在搜索框中开始有文字，当点击之后文字消失的效果。之前用的都是HTML5中的placeholder属性，但是在IE8中改属性用不了。
在其他地方搜索答案，都是通过js来解决的，感觉比较麻烦，有没有其他的解决办法？直接利用css hack可以解决吗？或者说&input type="text"value=""/&采用value的方式？
&input type="text"onblur="if (this.value == '') {this.value = 'Search';}"onfocus="if (this.value == 'Search') {this.value = '';}"value="Search"&
用js就挺好，哪里会麻烦，有写好的插件。
&span&placeholder&/span&
&input type='text' /&通过css就行了
添加你想要问的问题
PHP开发框架
开发工具/编程工具
服务器环境
ThinkSAAS商业授权：
ThinkSAAS为用户提供有偿个性定制开发服务
ThinkSAAS将为商业授权用户提供二次开发指导和技术支持
让ThinkSAAS更好，把建议拿来。
开发客服微信今天看啥 热点：
Html5的placeholder属性(IE兼容)，html5placeholder
HTML5对Web Form做了许多增强，比如input新增的type类型、Form Validation等。
Placeholder是HTML5新增的另一个属性，当input或者textarea设置了该属性后，该值的内容将作为灰字提示显示在文本框中，当文本框获得焦点时，提示文字消失。以前要实现这效果都是用JavaScript来控制才能实现 ,&firefox、google chrome等表示对其支持 ,&唯独IE存在违和感啊!
例如: &&input&id=&t1&&type=&text&&placeholder=&请输入文字&&/&
介绍一个超强的让IE下支持placeholder的属性插件,同时也兼容其他不支持placeholder的浏览器,代码如下:
$(document).ready(function(){
var doc=document,
inputs=doc.getElementsByTagName('input'),
supportPlaceholder='placeholder'in doc.createElement('input'),
placeholder=function(input){
var text=input.getAttribute('placeholder'),
defaultValue=input.defaultV
if(defaultValue==''){
input.value=text
input.onfocus=function(){
if(input.value===text)
this.value=''
input.onblur=function(){
if(input.value===''){
this.value=text
if(!supportPlaceholder){
for(var i=0,len=inputs.i&i++){
var input=inputs[i],
text=input.getAttribute('placeholder');
if(input.type==='text'&&text){
placeholder(input)
直接把代码复制下来,保存成一个js文件引用即可，不用再做任何处理，超级便利!
---------------------------------------------------------------------------------------------------------------------------
ex : 这样做的确能让IE的Input显示placeholder属性,但是如果页面上只有一个input还好,如果是多个input,如果出现input没有填入任何值的话,那么它的空input会自动将placeholder的值填进value里面,从而发生错误.例如:
&input type=&text& placeholder=&输入商品编码& name=&goodscode& id=&goodscode& value=&123& /&
&input type=&text& placeholder=&输入商品名称& name=&goodsname& id=&goodsname& value=&输入商品名称& /&
解决办法就是在后台自己判断啦 , 也许能在上面的js文件里解决 , 以后再研究啦~!
丰塔纳提高和规范好吧
具体属性名称是placeholder，这个属于html5的新属性，这个需要浏览器支持该属性才可以，比如ie9之下的浏览器即是设置了该属性，也不会有效果。参见 .cn/html5/tag_input.asp.cn/...er.asp
相关搜索：
相关阅读：
相关频道：
&&&&&&&&&&&&&&&&&&
WEB前端教程最近更新用JavaScript解决Placeholder的IE8兼容有关问题 - JavaScript当前位置:& &&&用JavaScript解决Placeholder的IE8兼容有关问题用JavaScript解决Placeholder的IE8兼容有关问题&&网友分享于：&&浏览：0次用JavaScript解决Placeholder的IE8兼容问题
HTML5新加的Placeholder属性可以很方便的代替之前用onfocus,onblur的方法，并且比它更强大，但是万恶的IE8却不兼容。可以使用JavaScript来解决IE8兼容问题，在IE8下，自动替换成onfocus方法，在支持HTML5的浏览器中则还是用Placeholder，不干扰。首先需要添加jQuery如果你的网站已经添加了jQuery，请忽略这一部。在网站Head标签内添加：&script type="text/javascript" src="/jquery-1.5.2.min.js"&&/script&添加js代码将以下代码添加到&/body&之前的任意位置： &script type="text/javascript"&&& & if( !('placeholder' in document.createElement('input')) ){&& & &&& $('input[placeholder],textarea[placeholder]').each(function(){&&& &&&&& var that = $(this),&&& &&&&& text= that.attr('placeholder');&&& &&&&& if(that.val()===""){&&& &&&&&&& that.val(text).addClass('placeholder');&&& &&&&& }&&& &&&&& that.focus(function(){&&& &&&&&&& if(that.val()===text){&&& &&&&&&&&& that.val("").removeClass('placeholder');&&& &&&&&&& }&&& &&&&& })&&& &&&&& .blur(function(){&&& &&&&&&& if(that.val()===""){&&& &&&&&&&&& that.val(text).addClass('placeholder');&&& &&&&&&& }&&& &&&&& })&&& &&&&& .closest('form').submit(function(){&&& &&&&&&& if(that.val() === text){&&& &&&&&&&&& that.val('');&&& &&&&&&& }&&& &&&&& });&&& &&& });&&& & }&& &/script&&
12345678910
12345678910
12345678910 上一篇：下一篇：文章评论相关解决方案 12345678910 Copyright & &&版权所有使用伪元素可以改变input标签中placeholder显示的格式，以颜色为例:
::-webkit-input-placeholder { /* WebKit browsers */
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
::-moz-placeholder { /* Mozilla Firefox 19+ */
:-ms-input-placeholder { /* Internet Explorer 10+ */
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：48291次
排名：千里之外
原创：20篇
(1)(1)(3)(2)(1)(1)(1)(3)(3)(1)(1)(3)(5)(1)

我要回帖

更多关于 ie8支持placeholder 的文章

 

随机推荐