【问题标题】:Issue while calling custom google search tag in javascript在javascript中调用自定义谷歌搜索标签时出现问题
【发布时间】:2016-05-05 09:27:44
【问题描述】:

我正在使用谷歌自定义搜索 api,但我不想要谷歌搜索默认文本框,所以为了同样的原因,我创建了一个新的文本框和一个按钮。单击我的自定义按钮时,我将从我的自定义文本框中获取搜索键值并将其放入谷歌搜索默认文本框中。但在我的 javascript 函数中,我无法执行谷歌搜索提交按钮的点击事件。我现在知道 google 搜索提交按钮的类名,如何在我的 java 脚本函数中执行点击事件?

google search dubmit 按钮类名是“gsc-search-button gsc-search-button-v2”

现在在下面的方法中我需要执行上述类的点击事件。

<script>
function myFunction() {
   document.getElementById('gsc-i-id1').value = document.getElementById('customTextBox').value;
 // here I need to perform click event for "gsc-search-button gsc-search-button-v2" class
}
</script>script>

我在以下链接中有演示示例,

http://jsfiddle.net/3L4fd63g/3/

大家有什么建议

【问题讨论】:

    标签: javascript jquery html google-search google-custom-search


    【解决方案1】:

    我看到了 标签,所以这里有一个选项可以处理表单的提交,因此文本框上的回车键也将执行搜索。

    另外,要执行点击,您只需拨打.click()

    // Make sure in jsFiddle you have selected option onLoad.
    (function() {
      var cx = '017643444788069204610:4gvhea_mvga'; // Insert your own Custom Search Engine ID here
      var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
      gcse.src = (document.location.protocol == 'https' ? 'https:' : 'http:') +
          '//www.google.com/cse/cse.js?cx=' + cx;
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
    })();
    
    $(function(){
    
      $('#search').submit(function(e){
        $('.gsc-input').val($('#customTextBox').val());
        $('input.gsc-search-button').click();
        e.preventDefault();
      });
    
    });
    .search-box{
      display:none;
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    
    <form id="search">
      <input type="text" id="customTextBox"/>
      <input type="submit" value="Click me" />
    </form>
    
    <div class="search-box">
        <gcse:searchbox></gcse:searchbox>
    </div>
    
    <gcse:searchresults></gcse:searchresults>

    【讨论】:

    • 我在你的演示中没有得到结果。我也试过在 jsfiddle jsfiddle.net/3L4fd63g/8 它不工作。能否请您在 jsfiddle 中更新并更新相同的内容
    • 点击上面的“运行代码sn-p”即可。另外,请参阅此小提琴> jsfiddle.net/3L4fd63g/9
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-03-05
    • 1970-01-01
    • 2015-10-18
    相关资源
    最近更新 更多