同一页面上多个Google CSE（自定义搜索引擎）框

我正试图在同一页面上实现两个（不同的）Google CSE搜索框。问题是只有第一个实例才能正常工作。例如，标题中的网站范围搜索框，然后是特定页面上的第二个搜索框，该搜索框在网站的狭窄筒仓内搜索等。同一页面上多个Google CSE（自定义搜索引擎）框

这不能正常工作，因为使用谷歌生成的代码为每个框，他们都获得相同的表单ID，这显然是无效的。这会导致谷歌水印品牌未能出现在方框＃2中，并且一些auto/google生成的变量也无法为第二个方框生成，例如ss参数（搜索会话）。

现在，搜索本身在两个框中工作，例如，用户搜索，以纠正结果页面，并显示正确的结果。

我只是想解决这个问题：我怎样才能让第二种形式获得不同的ID值（并且仍然正常工作 - 正如谷歌的javascript寻找ID cse-search-box）我已经尝试添加一个唯一的标识符在<form>元素的ID和NAME属性，但是这引起了google.com JavaScript出现（因为我相信它会查找`CSE-搜索框”只）

代码如下：

搜索框1：

<form id="cse-search-box" name="cse-search-box" class="search searchHeader" method="get" action="/search"> 
<input type="hidden" name="cx" value="partner-pub-0000000000000000:000" /> 
<input type="hidden" name="cof" value="FORID:10" /> 
<input type="hidden" name="ie" value="UTF-8" /> 
<input type="text" name="q" id="q" class="text_input" /> 
<input type="submit" name="sa" value="Search" class="submit" /> 
</form> 
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=en"></script>

搜索框2：

<form id="cse-search-box" name="cse-search-box" class="search searchWebDirectory" method="get" action="/search"> 
    <input type="hidden" name="cx" value="partner-pub-0000000000000000:111" /> 
    <input type="hidden" name="cof" value="FORID:10" /> 
    <input type="hidden" name="ie" value="UTF-8" /> 
    <input type="text" name="q" id="q" class="text_input" /> 
    <input type="submit" name="sa" value="Search" class="submit" /> 
</form> 
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=en"></script>

来源

2013-03-23 GWR

来自：http://www.google.com/cse/docs/cref.html

在名为 “形式”/鸡舍/ CSE /品牌参数输出第一的getElementById中的代码。因此，使用http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en将创建一个cse-search-box-目标代码，同时给它box2将在不同的ID上触发。保留关键字searchbox_demo。如果您想要：http://jsfiddle.net/JTV6f/1/。考虑到你在做什么，但是，如果我是你，我会切换到V1或V2 API。

来源

2013-04-01 16:28:12

了这是你要找的东西？有没有其他方法可以帮助你或者澄清我的答案？ – 2013-04-01 17:18:03

正是我在找的东西。谢谢。 – GWR 2013-04-01 21:18:22

不是问题！顺便提一下CSE API。您可能会喜欢额外的自定义选项！ – 2013-04-01 21:36:12

这是一个经过测试的解决方案。花了我一段时间，但我很慢，我一直不使用CSS。

使用V1代码。当您在安装屏幕上选择获取代码时，V1代码有一个选项。

把你的搜索代码在一个div

div tag 

searchcode 

end div tag

让您的CSE的变量是唯一的。这将是代码顶部的两个地方。

div id='cse'

和低一点

customSearchControl.draw('cse', options);

每个搜索这些应该比其他搜索相同，但不同的。我用过cse0，cse1，cse2。

这将修复搜索，以便每个搜索都按指定方式工作，但它们仍会共享相同的CSS。

因此，用scoped属性限定你的样式。

style type='text/css' scoped

为每个搜索代码执行此操作。现在，您的搜索可以有自己的外观和感觉，颜色等

http://deltaboogie.com/search

感谢，毛拉里

来源

2015-01-10 14:19:04

同一页面上多个Google CSE（自定义搜索引擎）框

回答

相关问题