IE9、IE8以下浏览器貌似不支持Placeholder,怎么破?
mpccc 发布于 1488883273

HTML5有个新属性Placeholder,很常用,可惜不兼容IE8 IE9,不知道有什么办法可以搞定?

二筒 发布于 1488883675

这个插件不错哦,我用这个搞定的

https://github.com/mathiasbynens/jquery-placeholder

w3cschool 发布于 1488883465

可以试试这个插件,试过没问题

(function($)
{
// check for native placeholder support. Borrowed from Modernizr.
var placeholderSupport = !!( 'placeholder' in document.createElement('input') );

$.fn.placeholder = function(text)
{
// if placeholder is supported natively, exit
if (placeholderSupport) return this;

// else:
return this.each(function()
{
var $this = $(this);

text = text || $this.attr('placeholder');

// if it's not a input element, exit
if ( this.tagName !== "INPUT" )
{
$.error('jquery.placeholder only works on "input" elements. Does not support "' + this.tagName.toLowerCase() + '" elements.');
return;
}

// If placeholder has already been applied, exit
if ( $this.data('jquery-placeholder') ) return;

// If not, let's mark it now as having placeholder applied
$this.data('jquery-placeholder', true);

// if its value is empty, let's add the placeholder text
if ( $this.val() === '' )
{
$this.val( text ).addClass('placeholder');
}

// Now, let's setup the focus & blur events, to add and remove the text & the class, respectively.
$this.focus(function()
{
var $this = $(this);
if ( $this.val() === text && $this.hasClass('placeholder') )
{
$this.val('').removeClass('placeholder');
}
})
.blur(function()
{
var $this = $(this);
if ( $this.val() === '')
{
$this.val( text ).addClass('placeholder');
}
});

});
};

// Now, before we leave, let's just make sure that these placeholder values never get submitted
placeholderSupport || $(document).delegate('form', 'submit', function()
{
$(this)
.find('.placeholder')
.val('').removeClass('placeholder');
});

})(jQuery);

 

$('input[placeholder]').placeholder();

 

fiddle地址: http://jsfiddle.net/vNkPD