BloggerAds廣告

相關文章

2014年3月31日 星期一

input password placeholder workaround IE

the workaround solution for using placeholder on IE<10
it works for IE7~10

(credits to http://jsfiddle.net/q8ajJ/)

HTML
<!-- Style = display none for people who dont have javascript -->
<input id="fake_pass" name="fake_pass" style="display: none;" type="text" value="Enter Password:" />
<input id="real_pass" name="real_pass" type="password" />


JS
// On DOM ready, hide the real password
$('#real_pass').hide();

// Show the fake pass (because JS is enabled)
$('#fake_pass').show();

// On focus of the fake password field
$('#fake_pass').focus(function(){
    $(this).hide(); //  hide the fake password input text
    $('#real_pass').show().focus(); // and show the real password input password
});

// On blur of the real pass
$('#real_pass').blur(function(){
    if($(this).val() == ""){ // if the value is empty, 
        $(this).hide(); // hide the real password field
        $('#fake_pass').show(); // show the fake password
    }
    // otherwise, a password has been entered,
    // so do nothing (leave the real password showing)
});

沒有留言 :

張貼留言