JQ Click the Text field to clear the default value and submit the form code to carriage return

JQ Click the Text field to clear the default value and submit the form code to carriage return

Click on the Text field to clear the default value. The default value is grayed out when it is clicked, and can be tied to a carriage return event.
The project is commonly used in an effect, packaged into a small plug-in, a little less complicated, need to look at the demo demo source code comments. If you don't want to just clear a default text to a jquery library, you can use the original to write my thoughts, very simple.
Characteristics
1. Support input text fields and textarea add the same default value for multiple forms at the same time;
2. The default value can be set by the form value value or by the plug-in parameter (iset.curval). Iset.curval The default value is NULL, but it takes precedence over the form value value, and the value of the form value is ignored when the Iset.curval value is set iset.curval;
3. The default value when the color customization;
4. Supports binding carriage return events, default to null, and can pass in the element that needs to bind carriage return events.
;(function ($) {
$.fn.extend ({
Iclear:function (options) {
var Iset = {
name:null,//get form elements such as $ (': Text ')
curval:null,//default display text, takes precedence over form defaults, and calls form defaults when empty
Color: ' #000 ',//click and enter value
Curcolor: ' #ccc ',//default color
Enter:null
}
Options=$.extend (iset, Options | | {});
Iset.name.each (function () {
When setting the default value is assigning a default value to a form
if (iset.curval!= null) {
Iset.name.val (Iset.curval);
}
Form Focus,blur Events
$ (this). CSS tutorials (' color ', iset.curcolor). focus (function () {
$ (this). CSS (' color ', iset.color);
if ($ (this). val () = = (iset.curval. Iset.curval:this.defaultvalue)) {
$ (this). Val (');
}
}). blur (function () {
if ($ (this). val () = = ') {
$ (this). Val (Iset.curval iset.curval:this.defaultvalue). CSS (' color ', iset.curcolor);
}
});
Binding Carriage Return Events
if (iset.enter!= null) {
$ (this). KeyDown (function (e) {
if (E.keycode = = 13) {
Iset.enter.click ();
}
});
}
});
}
});
}) (jquery);

Full instance Code

<style>
/*demo css*/
#demo label input{_margin-top:1px;margin:5px 8px 5px 0;padding-left:5px;border:1px solid #999; width:200px;height:20px ; Font-size:14px;color: #000}
#demo textarea{width:200px;height:60px;border:1px Solid #999}
</style>

<form action= "#" method= "POST"
<div id= "Demo"
<label for= "Id_0" ><strong> Input-one:</strong><input type= "text" value= "input-I am the default value" Id= "Id_0"/></label><input type= " Submit "value="/>
<br/>
<label for= "Id_1" ><strong>input-two:</strong>< Input type= "text" value= "input-I am the default value" Id= "Id_1"/></label><input type= "Submit" value= "Submission"/>
<br />
<label for= "id_2 ><strong>input-three:</strong><input type=" text "value=" input-I am the default value "Id=" id_2 "/></label><input type=" Submit "value=" commit "/>
<br/>
<br/>
<textarea>textarea-I am the default value </textarea>
<textarea>textarea-I am the default </textarea>
< textarea>textarea-I am the default value </textarea>
</div>
</form>

<script src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" ></script>
<script>

;(function ($) {
$.fn.extend ({
Iclear:function (options) {
var Iset = {
name:null,//get form elements such as $ (': Text ')
curval:null,//default display text, takes precedence over form defaults, and calls form defaults when empty
Color: ' #000 ',//click and enter value
Curcolor: ' #ccc ',//default color
Enter:null
}
Options=$.extend (iset, Options | | {});
Iset.name.each (function () {
When setting the default value is assigning a default value to a form
if (iset.curval!= null) {
Iset.name.val (Iset.curval);
}
Form Focus,blur Events
$ (this). CSS (' color ', iset.curcolor). focus (function () {
$ (this). CSS (' color ', iset.color);
if ($ (this). val () = = (iset.curval. Iset.curval:this.defaultvalue)) {
$ (this). Val (');
}
}). blur (function () {
if ($ (this). val () = = ') {
$ (this). Val (Iset.curval iset.curval:this.defaultvalue). CSS (' color ', iset.curcolor);
}
});
Binding Carriage Return Events
if (iset.enter!= null) {
$ (this). KeyDown (function (e) {
if (E.keycode = = 13) {
Iset.enter.click ();
}
});
}
});
}
});
}) (jquery);

Plug-in calls
$ (function () {
$ (' #demo '). Iclear ({
Name: $ (': Text '),
Enter: $ (': Submit ')
});
$ (' #demo '). Iclear ({
Name: $ (' textarea '),
Curval: ' I am the Reset value '
});
});

</script>