Textbox watermark using simple javascript without Ajax or JQuery

Introduction

Using this example we can create the text box with water mark text without using any jQuery or jQuery Plug in.

Description:

In the previous examples, we have learned how to keep watermark text for the text box using AJAX control tool kit.

In this example we are using inline little bit javascript if condition by using onclick, onfocus and onblur events.

Code:

<html>
<head>
<title>www.jqueryexamplecode.blogspot.com</title>
</head>

<body>
<label>Watermark textbox</label>
<input type="text" value="jqueryexamplecode..." onclick="if(this.value=='jqueryexamplecode...'){this.value=''}" 
onfocus="if(this.value=='jqueryexamplecode...'){this.value=''}"
onblur="if(this.value==''){this.value='jqueryexamplecode...'}">
</body>
</html>

Output Video:


Output:



If you have any queries or suggestions, please feel free to ask in comments section.

Post a Comment