You can use the solution described in link

Solution for non-compliant browsers :

Using a function called placeholder() :

function placeholder(str){
    $('input').css('color','#ccc');
    $('input').val(str);
}

You should run it once when you load your page:

placeholder("Digite o produto desejado...");

And you should assign these events to your input, which would be ao clicar nele (click) clear the value of it, and ao sair dele (blur) put the placeholder again.

$('input').on("click", function () {
  var ValorAnterior = $.cookie("ValorAtual") || "";
  $(this).val(ValorAnterior);
});
$('input').on("blur", function () {
  $.cookie("ValorAtual", $(this).val());
  placeholder("Digite o produto desejado...");
});

However you have to include the jQuery Cookie plugin (if you wish to use another form of cookie, / p>     

There is a project on GitHub to address this issue:

Placeholders.js - An HTML5 placeholder attribute polyfill

To use it, it's as simple as including the Javascript file on the page:

 <script src="caminho/para/Placeholders.js"></script>

Note :

The advantage is that you can have your markup updated by making use of the placeholder="X" attribute and in older browsers Placeholders.js will ensure everything works just like in modern browsers.

Here's the list of support you get when using it:

  

• Internet Explorer 6 - 9 (with Placeholders.js)
  
• Firefox 1 - 3 (with Placeholders.js), 4+ (native)
  
• Opera 7 - 10 (with Placeholders.js), 11+ (native)
  
• Safari 3.2 (with Placeholders.js), 4+ (native)
  
• Chrome 4+ (native)
  
• Flock 1.0+ (with Placeholders.js)
  
• Konqueror 4.3 (with Placeholders.js)
  
• SeaMonkey 1+ (with Placeholders.js)
  
• Maxthon 1+ (with Placeholders.js)
  
• SlimBrowser 5 (with Placeholders.js)
  
• K-Meleon 0.7+ (with Placeholders.js)
  

You can do it this way:

jQuery("input[placeholder]").focus(function(){
  if ( jQuery(this).val() == jQuery(this).attr('placeholder') ){
    jQuery(this).removeClass('placeholder').val('');
  }
}).blur(function(){
  if ( jQuery(this).val() == '' ){
    jQuery(this).addClass('placeholder').val( jQuery(this).attr('placeholder') );
  }
}).trigger('blur');

input.placeholder{color: green}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><form>Nome:<inputtype="text" name="nome" placeholder="Nome" /><br><br>
  Telefone: <input type="text" name="telefone" placeholder="Telefone" /><br><br>
  RG: <input type="text" name="rg" placeholder="RG" />
</form>