HTML 5 input placeholder

Comments: This article mainly introduces the HTML 5 input placeholder attribute perfectly serves as ie. If you need it, please refer to the reference jquery class library.

The Code is as follows:
$ (Document). ready (function (){
If ($. browser. msie)
$ ("Input: text, input: password"). each (function (){
Var $ placeholder = $ (this). attr ("placeholder ");
Var $ width = (this).css ("width ");
Var $ id = $ (this). attr ("id ");
Var $ height = parseint((this).css ("height") + 6 + "px ";
Var $ fontSize = (this).css ("font-size ");
Var $ fontWeight = expires (this).css ("font-weight ");
Var $ lineHeight = $ height;
If (((this).css ("line-height ")! = "Normal "){
$ LineHeight = parseint((this).css ("line-height") + 6 + "px ";
}
If ($ placeholder! = Undefined ){
$ (This ). after ("<span class = \" placeholder ph _ "+ $ id +" \ "style = \" width: "+ $ width +"; line-height: "+ $ lineHeight +"; height: "+ $ height +"; font-weight: "+ $ fontWeight +"; margin-left:-"+ $ width + "; font-size: "+ $ fontSize +" \ ">" + $ placeholder + "</span> ");
}
$ (This). bind ("keyup", function (){
If ($ (this). val () = ""){
$ (This). parent (). find (". ph _" + $id).css ("display", "inline-block ");
}
Else {
$ (This). parent (). find (". ph _" + $id).css ("display", "none ");
}
});
});
$ (". Placeholder"). live ("click", function (){
$ (This). prev (). focus ();
});
});

Page call

The Code is as follows:
<Input id = "n1" type = "text" placeholder = "I am prompted that the content is normal"/>

<Input id = "n2" type = "text" placeholder = "I am prompted for content width and height" style = "width: 100px; height: 100px;"/>

<Input id = "n3" type = "text" placeholder = "I am prompted that I have other styles"/style = "width: 300px; height: 40px; font-weight: bold; ">

<Input id = "n4" type = "text" placeholder = "You can try other"/>


Style

The Code is as follows:
<Style type = "text/css">
. Placeholder {display: inline-block; color: gray; vertical-align: top; overflow: hidden ;}
</Style>