让IE低版本浏览器也支持placeholder属性

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>让IE低版本浏览器也支持placeholder属性</title>
    <script type="text/javascript"  src="http://ajax.microsoft.com/ajax/jquery/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
        $(function () {
            if (/MSIE\s(\d+)/.test(navigator.userAgent) && navigator.userAgent.match(/MSIE\s(\d+)/)[1] < 10) {
                $('[placeholder]').each(function () {
                    var pla = $(this).attr('placeholder');
                    $(this).focus(function () {
                        if ($(this).val() == pla) {
                            $(this).val('');
                        }
                    }).blur(function () {
                        if ($(this).val() == '') {
                            $(this).val(pla);
                        }
                    });
                    $(this).trigger('blur');//此处利用blur事件,为了业务需求。防止页面上查询后，文本框需要保留搜索的关键被placeholder代替
                });
            }
        });
    </script>
</head>
<body>
    <input type="text" placeholder="请输入关键字" />
</body>
</html>
posted @ 2014-12-22 11:55  老廖  阅读(202)  评论(0)    收藏  举报