Question

直升机，

我正在创建Google cse函数进行搜索。使用此代码脚本不会设置查询字符串。它无尽的刷新页面。也许有人知道如何正确使用它？我只需要每个搜索不同的页面，例如： http://page.com/search?q=first+search我可以用parseParamsFromUrl函数以某种方式吗？

    <div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'en', style : google.loader.themes.MINIMALIST});
google.setOnLoadCallback(function(){
var cse = new google.search.CustomSearchControl('13707349811359660237:cl5vrpn6mu8');
cse.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
cse.draw('cse');
cse.setNoResultsString('No results for this query, try a different search.');
cse.setSearchStartingCallback({}, function() {
var q = cse.getInputQuery();
window.location.search = '?q='+q;
});
Function parseParamsFromUrl() {
  var params = {};
  var parts = window.location.search.substr(1).split('\x26');
  for (var i = 0; i < parts.length; i++) {
    var keyValuePair = parts[i].split('=');
    var key = decodeURIComponent(keyValuePair[0]);
    params[key] = keyValuePair[1] ?
        decodeURIComponent(keyValuePair[1].replace(/\+/g, ' ')) :
        keyValuePair[1];
  }
  return params;
}
var urlParams = parseParamsFromUrl();
var queryParamName = "q";
if (urlParams[queryParamName]) {
  cse.execute(urlParams[queryParamName]);
}
}, true);
</script>

任何帮助都是适当的

Answer 1

我自己回答了我的问题。这是工作脚本

google.load('search', '1', {language : 'lt style: google.loader.themes.MINIMALIST '});
google.setOnLoadCallback(function() {
    var customSearchControl = new google.search.CustomSearchControl('014092587915392242087:l98hzi05fja'); // change this to your unique ID
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    customSearchControl.setLinkTarget(google.search.Search.LINK_TARGET_NEW); // open results in new window
    var options = new google.search.DrawOptions();
    options.setAutoComplete(true);
    customSearchControl.draw('cse'); // set the results div id
    customSearchControl.execute("<?php if (isset($_GET['q'])) echo filter_var($_GET['q'],     FILTER_SANITIZE_STRING); ?>"); // run the search using the value of $_GET['q']
    customSearchControl.setSearchStartingCallback({}, function() {
        var q =  customSearchControl.getInputQuery();
        window.location.search = '?q='+q;
    });
}, true);

现在每个搜索都会显示在网址

中

Answer 2

您可以在JavaScript中实际实现此功能，并在使用HTML5历史记录API而不是刷新页面时进一步改进。我就这样做了：

首先，我们需要jQuery插件来获取params（如果你有PHP但不是必需的，仅供参考）：

(function($) {
    $.QueryString = (function(a) {
        if (a == "") return {};
        var b = {};
        for (var i = 0; i < a.length; ++i)
        {
            var p=a[i].split('=');
            if (p.length != 2) continue;
            b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
        }
        return b;
    })(window.location.search.substr(1).split('&'))
})(jQuery);

接下来是一个无需刷新即可更改地址的功能，为不支持历史记录API的旧浏览器提供后备功能：

function pushState(path) {
    if (typeof(window.history.pushState) == 'function') {
        window.history.pushState(null, path, path);
    } else {
        window.location.hash = '#!' + path;
    }
}

最后是Google CSE的代码，假设您的搜索页面位于/search

google.load('search', '1', {language : 'en', style : google.loader.themes.MINIMALIST});
google.setOnLoadCallback(function() {
    var searchControl = new google.search.CustomSearchControl('YOUR_SEARCH_ID');
    searchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET );
    searchControl.draw('cse');
    searchControl.execute($.QueryString["q"]);
    searchControl.setSearchStartingCallback({}, function() {
            var q =  searchControl.getInputQuery();
            pushState("/search?q=" + q);
    })
}, true);

自定义Google自定义搜索jsapi（查询字符串）

2 个答案: