Answer:
You do not need anything of what you're doing, you can only use the placeholder
attribute of <input>
like this:
<input type="text" class="pesquisa-class" placeholder="Digite o produto desejado..." value="">
Explanation:
Use javascript to do what you need, would not % html contains some attributes that
The placeholder is the most modern way of informing the user what he has to type in that field, previously we used Label's that would be texts above the field.
Compatibility:
Tested and working in the following browsers:
- Mozilla Firefox (27.0)
- Google Chrome (32.0)
- Safari (5.1.7)
- Opera (12.16)
- Internet Explorer (IE11, IE10)
Does not work in the following browsers:
- Internet Explorer (IE9, IE8, IE7)
Using a function called <input>
:
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 placeholder
(click) clear the value of it, and placeholder()
(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>