Placeholder is not displaying in IE for password field

Question

I have implemented the following scripts to display placeholders in IE for inputbox,but it is not working for password field ,Please advice me..

<script>
 jQuery(function() {
    jQuery.support.placeholder = false;
    test = document.createElement('input');
    if('placeholder' in test) jQuery.support.placeholder = true;
    });

    // Placeholder for IE
    $(function () {
        if(!$.support.placeholder) { 

            var active = document.activeElement;
            $(':text, textarea').focus(function () {
                if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
                    $(this).val('').removeClass('hasPlaceholder');
                }
            }).blur(function () {
                if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
                    $(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
                }
            });
            $(':text, textarea').blur();
            $(active).focus();
            $('form').submit(function () {
                $(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
            });
        }  

    });
</script>

seems very big code for a placeholder. you might want to browse this [post](http://stackoverflow.com/a/19899531/1577396) — Mr_Green, Mar 03 '14 at 07:25

score 2 · Accepted Answer · answered Mar 03 '14 at 07:25

2

Try to add input[type="password"] to your selector, so change:

$(':text, textarea')

to:

$(':text, textarea, input[type="password"]')

since :text selector only select <input type="text"> elements

answered Mar 03 '14 at 07:25

Felix

37,892
8
43
55

score 2 · Answer 2 · answered Mar 03 '14 at 07:28

Two issues:

You're not selecting password fields. The :text jQuery selector only selects inputs that are type=text (either explicitly or implicitly). You'd have to add input[type=passsword] to your selector to also include password fields.
But once you fix that, you'll have the problem that, of course, the password field's value is displayed obscured. So setting your placeholder text on it won't show the placeholder. You'll have to show the placeholder text some other way, such as a span or div that you overlay on top of the field.

Placeholder is not displaying in IE for password field

2 Answers2