html5新标签【placeholder】解决浏览器低版本不兼容问题

来源:互联网 发布:消防四知四会四个能力 编辑:程序博客网 时间:2024/05/11 23:00

1、html5新标签【placeholder】

IE10+支持placeholder属性,在IE9以下版本浏览器就失效了,解决办法

function placeholderSupport() {
    return 'placeholder' in document.createElement('input');
}
$(function(){
if(!placeholderSupport()){   // 判断浏览器是否支持 placeholder
    $(document).ready(function(){
         //默认遍历循环添加placeholder
        $('[placeholder]').each(function(){
            $(this).parent().append("<span class='placeholder'>"+$(this).attr('placeholder')+"</span>");
        })


        $('[placeholder]').keypress(function(){//如果键盘输入时,隐藏placeholder
        $(this).parent().find('span.placeholder').hide();
        })
        $('[placeholder]').blur(function(){
        if($(this).val()==""){  //如果当前值为空,显示placeholder
                $(this).parent().find('span.placeholder').show();
            }
        })
    });
    }
});   

阅读全文
0 0
原创粉丝点击