placeholder在IE8中不显示，一种解决办法

做的一个查询页面，在IE10的基础上做的，input标签用到了placeholder属性。将页面放到IE8去显示，placeholder属性失效了。从网上查找了很多方法，最终采取使用JS的方式解决了兼容的问题。

HTML代码

<input id="valiCode" class="aaa" type="text" placeholder="请输入验证码"
οnblur="if(this.value==''){this.value='请输入验证码';$(this).css({color:'#8E8E8E'})}"
οnfοcus="if(this.value=='请输入验证码'){this.value='';$(this).css({color:'#000000'})}"
style="color:#8E8E8E" value="请输入验证码"/>

利用onblur和onfocus其实就是控制input中的value值，达到placeholder的效果。为了在IE10上显示效果相同，需要将placeholder的颜色样式修改一下。

css代码

:-moz-placeholder { Mozilla Firefox 4 to 18
    color: #8E8E8E; opacity:1; 
}

::-moz-placeholder { Mozilla Firefox 19+
    color: #8E8E8E;opacity:1;
}

input:-ms-input-placeholder{
    color: #8E8E8E;opacity:1;
}

input::-webkit-input-placeholder{
    color: #8E8E8E;opacity:1;
} 

总结：虽然使用JS实现了效果，但是实际效果跟placeholder还是不一样的。比如焦点落入input框中之后提示文字就消失了，然后placeholder实际效果并不是这样。希望前端大牛指正~