关于input 属性placeholder 在IE9下兼容

baiyong1930

于 2019-09-13 17:25:00 发布

阅读量223

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/smile-xin/p/11517236.html

本文分享了一种解决IE9浏览器中input属性placeholder不兼容问题的方法，通过使用jQuery插件实现placeholder效果，确保在IE9及以下版本的浏览器中也能正常显示提示文字。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天分享下同事关于input 属性placeholder 在IE9下不兼容的解决方案，小弟不是很懂，希望有看完的大佬说说你们的理解

<script src="http://www.jq22.com/jquery/1.8.3/jquery.min.js"></script>
<script>
(function($){
    $.fn.placeholder = function(options){
        var opts = $.extend({}, $.fn.placeholder.defaults, options);
        var isIE = document.all ? true : false;
        return this.each(function(){
            var _this = this,
                placeholderValue =_this.getAttribute("placeholder"); //缓存默认的placeholder值
            if(isIE){
                _this.setAttribute("value",placeholderValue);
                _this.onfocus = function(){
                    $.trim(_this.value) == placeholderValue ? _this.value = "" : '';
                };
                _this.onblur = function(){
                    $.trim(_this.value) == "" ? _this.value = placeholderValue : '';
                };
            }
        });
    };
})(jQuery);
$("input").placeholder();
</script>