How to remove placeholder on focus

FrancescoMussi picture FrancescoMussi · Oct 30, 2013 · Viewed 72k times · Source

I made this simple function to add placeholder in browsers that do not support it:

DEMO

The question is: How can I add to that function the possibility to remove the placeholder when the user click inside it?

Answer

Rohan Kumar picture Rohan Kumar · Oct 30, 2013

Try to use removeAttr() like,

$('input,textarea').focus(function(){
   $(this).removeAttr('placeholder');
});

Demo

To get the placeholder value again on blur() try this,

$('input,textarea').focus(function(){
   $(this).data('placeholder',$(this).attr('placeholder'))
          .attr('placeholder','');
}).blur(function(){
   $(this).attr('placeholder',$(this).data('placeholder'));
});

Demo 1