通过搜索表单再次Wordpress Google自定义搜索

时间:2017-03-29 03:16:33

标签: javascript php wordpress

抱歉再次惹恼你们,我还有一个问题还没有解决.. 如何在提交搜索表单后调用javascript函数?

工作流程应该是:在搜索内部填充内容并单击搜索按钮(searchform.php)后,它将发送表单并重定向,调用javascript函数(header.php)并在搜索页面上显示结果(搜索.php),

header.php的一部分:

<script>
  var renderSearchElement = function() {
    google.search.cse.element.render(
      {
        div: "default",
        tag: 'search'
      });
    google.search.cse.element.render(
      {
        div: "test",
        attributes: {
          disableWebSearch: true,
          enableHistory: true},
        tag: 'search'
      });
  };



  window.__gcse = {
        parsetags: 'explicit',
  };



  var loadElements = function() {
    var cx = 'YYYYYYYYYYYYYYYYYYYYY:XXXXXXXXXX';
    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);
  }



    var hndlr = function($response) {
      for (var i = 0; i < $response.items.length; i++) {
        var item = $response.items[i];

        // in production code, item.htmlTitle should have the HTML entities escaped.
        document.getElementById("content").innerHTML += "<br>";
        document.getElementById("content").innerHTML += "<br> Title : " + item.title;
        document.getElementById("content").innerHTML += "<br> ==================================== ";

        if(item.pagemap.hreview)
        {
            for(var j=0; j < item.pagemap.hreview.length; j++) {
                document.getElementById("content").innerHTML += "<br>" + j + ": " + item.pagemap.hreview[j].description;
            }
            document.getElementById("content").innerHTML += "<br>";
           }
      }
    }

    var curltestPHPonly = function()
    {
          $ch = curl_init(); 
        // set url 
        curl_setopt($ch, CURLOPT_URL, "https://www.googleapis.com/customsearch/v1?key=YYYYYYYYYYYYYYYYYYYYYYYYYYYYYY&cx=XXXXXXXXXXXXXXXXXXXXXX:XXXXXXX&q=wine&callback=hndlr"); 
        curl_exec($ch); 
    }

        var searchdata;



    var curltest = function() {
        searchdata = document.getElementById('curlinput');
            var urltest = document.createElement('script'); urltest.type = 'text/javascript'; urltest.async = true;
            urltest.src = 'https://www.googleapis.com/customsearch/v1?key=YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY&cx=XXXXXXXXXXXXXXXXXXXXXXX:XXXXXXXX&q='+searchdata.value +'&callback=hndlr';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(urltest, s);
    }



</script>

和shearform.php

<form  role="search" method="get" class="search-form"   action="<?php echo esc_url( home_url( '/' ) ); ?>" >

    <input type="search" id="curlinput" class="search-field" placeholder="search" value="" name="s" />

    <input type="submit" class="search-submit" value="submit" />
</form>

最后是search.php:

<?php


get_header(); ?>

    <section id="primary" class="content-area">
        <main id="main" class="site-main" role="main">


            <div id="content">result shows here</div>



        </main><!-- #main -->
    </section><!-- #primary -->
<?php

get_footer();
?>
非常感谢!!!

0 个答案:

没有答案