Version One
CSS Code section:
Copy Code code as follows:
. focus {
border:1px solid #f00;
Background: #fcc;
}
Add focus style, add border, and change background color to #fcc when focal point is obtained
HTML code section:
Copy Code code as follows:
<body>
<form action= "" method= "Post" id= "RegForm" >
<fieldset>
<legend> Personal basic Information </legend>
<div>
<label for= "username" > name:</label>
<input id= "username" type= "text"/>
</div>
<div>
<label for= "pass" > Password:</label>
<input id= "pass" type= "password"/>
</div>
<div>
<label for= "MSG" > Detailed information:</label>
<textarea id= "MSG" rows= "2" cols= "></textarea>"
</div>
</fieldset>
</form>
</body>
Here are two input, a textare box.
: Input matches all input, textarea, select, and button elements.
jquery Code section:
Copy Code code as follows:
<script type= "Text/javascript" >
$ (function () {
$ (": Input"). focus (function () {
$ (this). AddClass ("Focus");
}). blur (function () {
$ (this). Removeclass ("Focus");
});
})
</script>
Use: Input matches all input elements, and when the focus is obtained, the style focuses are added, and the current element is automatically identified by $ (this). The focus () method is the function that is taken when a focused event occurs. The blur () method is the function that is executed when the focus event occurs.
Version two:
Sometimes the text box has the default content, as a cue message, to get the focus, to let it disappear. Can do the following transformation:
Copy Code code as follows:
<script type= "Text/javascript" >
$ (function () {
$ (": Input"). focus (function () {
$ (this). AddClass ("Focus");
if ($ (this). Val () ==this.defaultvalue) {
$ (this). Val ("");
}
}). blur (function () {
$ (this). Removeclass ("Focus");
if ($ (this). val () = = ') {
$ (this). Val (This.defaultvalue);
}
});
})
</script>
Make a logical decision to empty the contents of the text box if the value is the default value.
Loses focus, if the text box is empty, that is, there is no input, the value is also set to the default value.
This is a simple logic.
