IE9以下不支持 placeholder 的解决方案

原创 molongv 随笔 兼容性问题 190阅读 2017-12-26 17:43:56 举报

<!--[if lt IE 10]>
<style>placeholder{ color: #757575;}</style>
<script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>; //解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题。
<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>; // 解决不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。
<script type="text/javascript">
$(function(){
if(!placeholderSupport()){ // 判断浏览器是否支持 placeholder
$('[placeholder]').focus(function() {
var input = $(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
input.removeClass('placeholder');
}
}).blur(function() {
var input = $(this);
if (input.val() == '' || input.val() == input.attr('placeholder')) {
input.addClass('placeholder');
input.val(input.attr('placeholder'));
}
}).blur();
};
})
function placeholderSupport() {
return 'placeholder' in document.createElement('input');
}
</script>

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复