代码之家 › 专栏 › 技术社区 › forrest

如何从Google搜索框中删除默认的Google搜索值?

jquery javascript

forrest · 技术社区 · 14 年前

我试图使用一个小jquery来“隐藏”谷歌搜索框中的初始值,当你点击这个框时,我丢失了一些东西。

这是搜索框代码:

<div id="search_box">
<form action="http://mfrp.ehclients.com/search_results" id="cse-search-box">
  <div>
    <input type="hidden" name="cx" value="017425724926122041548:1ccj3d-e1-s" />
    <input type="hidden" name="cof" value="FORID:9" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" id="q" name="q" value="Search..." size="31" />
  </div>
</form>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&amp;lang=en"></script>
</div>

下面是jquery:

<script type="text/javascript">
  $('#q').click(function() {           
  if($(this).val() == 'Search...') 
  $(this).val('');
  });
</script>

唯一的问题是,它不起作用。这里是 page .

我希望能有人帮我整理一下。

谢谢,

福雷斯特

2 回复 | 直到 14 年前

Nick Craver 14 年前

当您的代码需要运行时,当DOM元素可用时,所以 $("#q") 找到 id="q" 要绑定到的元素。这意味着脚本要么需要运行 在页面中需要的元素之后 (例如 <body> ,或者当DOM完全就绪时,如下所示:

$(function() {
  $('#q').click(function() {           
    if($(this).val() == 'Search...') 
      $(this).val('');
  });
});

如果你是不这样做,以及 $("#q") 选择器找不到任何元素…没有任何要运行的元素 .click() 在上,它绑定该处理程序。

我认为你想要的也是相反的,看起来像这样:

$(function() {
  $('#q').focus(function() {           
    if($(this).val() == 'Search...') $(this).val('');
  }).blur(function() {
    if($(this).val() == '') $(this).val('Search...');
  });
});

这将把“搜索…”放回框中,如果它是空的,有人点击外面,依靠 .focus() 和 .blur() 而不是 点击() .

Reigel Gallarde 14 年前

demo

你被谷歌伪造了…文本框的背景看起来好像有值…你应该在开发工具上检查一下。

所以试着在模糊中移除它…

$('#q').blur(function(){
    $(this).css('background','none');
    if(this.value == '') {
       this.value = this.defaultValue;
    }
}).focus(function() {           
    if(this.value == this.defaultValue) {
       this.value = '';
    }
});â

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前