Good idea ".on"s. IMHO, you can't set placheholders using this.value. My proposal: $(document).ready(function(){ $('#transl1').attr('placeholder','Start your search here') .on('focus',function(){ if ($(this).attr('placeholder') == 'Start your search here') { $(this).attr('placeholder',''); } }) .on('blur',function(){ if ($(this).attr('placeholder') == '') { $(this).attr('placeholder','Start your search here'); } }); }); HTH. Stefano
$("input[id=transl1]").attr("placeholder","Start your search here");
Is there an advantage to using "input[id=transl1]" over "#transl1" ? I've never seen a selector written that way when looking for something by id.
A couple of efficiency points:
If you have jQuery which makes multiple calls to the same element, you shouldn't query for that element more than once. Set a variable:
var transl1 = $("#transl1");
...and then re-use it:
transl1.attr("value","Start your search here");
Second, there's no reason to add an onfocus attribute when you can add an event handler. And really we don't need to set a variable after all because we can simply chain everything:
$(document).ready(function(){ $("#transl1").val("Start your search here") .on("focus",function(){ if(this.value == 'Start your search here'){ this.value = ''; } }) .on("blur",function(){ if(this.value==''){ this.value = 'Start your search here'; } }); });