JQuery clearme

Tags: html, jquery

Using jquery to clear the Search text inside a search textfield and putting it back if the user did not entered any value when the textfield looses focus.

It works on all browsers that jquery works on.

Back

+ Code snippet

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
<html>
<head>
<title>Clearme demo</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
</head>
<body>
<form method="" id="" action="">
<input class="clearme" type="text" name="search" value="Search" />
<input type="submit" name="" value="Search" />
</form>
</body>
<script type="text/javascript">
$(".clearme").focus(function(){
if(this.value == this.defaultValue){
this.value = "";
}
}).blur(function(){
if(!this.value.length) {
this.value = this.defaultValue;
}
});
</script>

</html>

Comments

login to post
    Photo by
    Sorin Popa