Skip to content

Instantly share code, notes, and snippets.

@ericwwsun
Created June 7, 2012 22:05
Show Gist options
  • Save ericwwsun/2891905 to your computer and use it in GitHub Desktop.
Save ericwwsun/2891905 to your computer and use it in GitHub Desktop.
Javascript: Placeholder in IE
// Form - Placeholder
if(!Modernizr.input.placeholder) {
//alert("no placeholder!!!!!");
$j("*:text:not([type='password'])").each(function(){
//$j(this).css("border","solid 1px red");
if( $j(this).attr("placeholder") && $j(this).attr("placeholder").length > 1 ) {
var placeholderTxt = $j(this).attr("placeholder");
$j(this).val(placeholderTxt);
$j(this).click(function(){
if( $j(this).val() == placeholderTxt ) {
$j(this).val("");
}
});
$j(this).blur(function(){
if( $j(this).val() == "" ) {
$j(this).val(placeholderTxt);
}
});
}
});
$j("input[type='password']").each(function(){
if( $j(this).attr("placeholder") && $j(this).attr("placeholder").length > 1 ) {
var $realPass = $j(this);
// create the fake password field
var thisID = $realPass.attr("id");
var thisName = $realPass.attr("name");
if( !$realPass.context.outerHTML ) {
return false;
}
var passHTML = $realPass.context.outerHTML; //only works in IE9?
passHTML = passHTML.replace('type="password"','type="text"');
passHTML = passHTML.replace('id="'+thisID+'"','id="fake-'+thisID+'"');
passHTML = passHTML.replace('name="'+thisName+'"',' ');
var $newPass = $j(passHTML);
$newPass.insertAfter($realPass);
$realPass.hide();
var placeholderTxt = $newPass.attr("placeholder");
$newPass.val(placeholderTxt);
$newPass.focus(function(){
$newPass.hide();
$realPass.show().focus();
});
$realPass.blur(function(){
if ( $realPass.val() == "" || $realPass.val() == placeholderTxt ) {
$realPass.hide();
$newPass.show();
}
});
}
});
} //if(!Modernizr.input.placeholder)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment