<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Style type = "text/css" media = "screen">
Body {font:. 9em/1.5 "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif ;}
Form {width: 20em; margin: 4em auto ;}
Dt {clear: left; float: left ;}
Dd {clear: right; margin-left: 6em ;}
Input, textarea {width: 12em; border: 1px solid # ccc ;}
Input: focus, textarea: focus {border: 1px solid # f00; background: # fcc ;}
. Ie_hover {background: # ffc ;}
. Ie_focus {border: 1px solid # f00; background: # fcc ;}
</Style>
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"> </meta>
<Title> the JQuery text box is focused and out of control! </Title>
<Script type = "text/javascript" src = "jquery. js"> </script>
</Head> <Script language = "javascript">
$ (Document). ready (function (){
If ($. browser. msie ){
// $ ("Input [@ type = 'text'], input [@ type = 'Password'], textarea "). focus (function () {$ (this ). addClass ("ie_focus ")}). blur (function () {$ (this ). removeClass ("ie_focus ")}); $ ("# Name "). focus (function () {$ (this ). addClass ("ie_focus ")}). blur (function () {$ (this ). removeClass ("ie_focus ")});
$ ("# Name "). focus (function () {$ (this ). addClass ("ie_focus ")}). blur (function () {name = $ ("# name "). val (); alert (name );}); $ ("# Username "). focus (function () {$ (this ). addClass ("ie_focus ")}). blur (function () {n = $ ("# <% = username. clientID %> ") [0]; alert (n. value) ;}); // server-side control elements
}
})
</Script> <Body>
<Form runat = "server">
<Dl>
<Dt> Name: <dt>
<Dd> <input type = "text" id = "name"/> </dd>
<Asp: TextBox ID = "username" runat = "server"> </asp: TextBox>
<Dt> Password: <dt>
<Dd> <input type = "password" id = "password"/> </dd>
<Dt> Textarea: <dt>
<Dd> <textarea id = "content"> </textarea> </dd>
</Dl>
</Form>
</Body>
</Html> |
