聚焦时，Jquery返回默认输入值

Question

我的搜索输入的默认值为“搜索”。

当我专注于输入时，值清除。

$(document).ready(function(){
    $('#search').focus(function() {           
        if($(this).val() == "Search for") 
        $(this).val('');
    });
});

如果您没有键入要搜索的内容，那么在聚焦时返回默认“搜索”值的好方法是什么？

Answer 1

这里有一小段代码供您使用。它将使用jQuery数据方法来保存指示用户键入内容的bool。如果此人没有输入任何内容，它将再次显示该文本。

$("#search").blur(function() {
    if (!$(this).data('hasTyped')) {
        $(this).val('Search for');
    }
}).keyup(function() {
    $(this).data('hasTyped', this.value.length);
}).focus(function() {
    if (!$(this).data('hasTyped')) {
        $(this).val('');
    }
});

示例：http://jsfiddle.net/jonathon/dbbBh/

Answer 2

如何使用focos

$("#search").focusout(function() {
$(this).val('Search for');
});

或模糊

    $('#search').focus(function(){
// focus logic goes here


}).blur(function(){

  $(this).val('Search for');

});

Answer 3

如果您已经在使用jQuery，为什么不使用watermark plugin？为什么需要重新发明轮子？

如果你必须自己做，

$(document).ready(function(){
    $('#search').focus(function() {           
        if($(this).val() == "Search for") 
        $(this).val('');
    }).focusout(function() {
      if($(this).val() === '')
         $(this).val('Search for');
    });
});

Answer 4

怎么样但倒“？”

$('#search').blur(function() {
    if($(this).val() == "" ) { 
        $(this).val('Search for');
    }
});