Question

I want to create a search field. My code so far:

<input type="text" value="Search" onfocus="if (this.value=='Search') 
{this.value='';}"  onblur="if (this.value=='') {this.value='Search';}" 
class="textbox"/>

I want to change the <input> tag to @Html.Editor("term").

How can I write the onfocus and onblur events using @Html.Editor("term")?

Answer 1

Why not use HTML5 placeholder attribute it does the same thing

Replace –

<input type="text" value="Search" onfocus="if (this.value=='Search') 
{this.value='';}"  onblur="if (this.value=='') {this.value='Search';}" 
class="textbox"/>

With

<input type="text" class="textbox" placeholder="Search" />

Demo: http://jsfiddle.net/uCkef/1/

Here is how you can make 'placeholder' attribute work in IE browsers –
http://dipaksblogonline.blogspot.in/2012/02/html5-placeholder-in-ie7-and-ie8-fixed.html

And for focus and blur events –

$('input').focus(function(){
   console.log('focused');
}).blur(function(){
   console.log('blured');
})