Placeholders are not displaying in IE8 for Bootstrap

Question

I am using Bootstrap for my project. The placeholders are displaying fine for all browsers except in Internet Explorer 8 and below.

Are there any solutions to get placeholder support in IE8?

Answer 1

you can use this plugin https://github.com/mathiasbynens/jquery-placeholder Even works in IE6

Answer 2

you can use jquery watermark plugin for that

https://code.google.com/p/jquery-watermark/

Answer 3

It should'nt be to hard to figure this out without a plugin, I'm guessing something close to this will do the trick:

var test = document.createElement('input');
if (!('placeholder' in test)) {
    $('input').each(function () {
        if ($(this).attr('placeholder') != "" && this.value == "") {
            $(this).val($(this).attr('placeholder'))
                   .css('color', 'grey')
                   .on({
                       focus: function () {
                         if (this.value == $(this).attr('placeholder')) {
                           $(this).val("").css('color', '#000');
                         }
                       },
                       blur: function () {
                         if (this.value == "") {
                           $(this).val($(this).attr('placeholder'))
                                  .css('color', 'grey');
                         }
                       }
                   });
        }
    });
}