WP Google插件/ JQuery提交选择

时间:2013-09-13 05:35:24

标签: jquery search select

以下代码来自WP Google Suggest插件

(function ($) {
    $.fn.googleSuggest = function (opts) {
        var services = {
            youtube: 'youtube',
            books: 'books',
            products: 'products',
            news: 'news',
            images: 'img',
            web: 'psy'
        };
        opts = $.extend({
            service: 'web',
            secure: false
        }, opts);
        opts.source = function (request, response) {
            $.ajax({
                url: 'http' + (opts.secure ? 's' : '') + '://suggestqueries.google.com/complete/search?callback=?',
                dataType: 'jsonp',
                data: {
                    q: request.term,
                    client: services['youtube'],
                    nolabels: 't'
                },
                success: function (data) {
                    response($.map(data[1], function (item) {
                        return {
                            value: $("<span>").html(item[0]).text()
                        }
                    }));
                }
            });
        };
        return this.each(function () {
            $(this).autocomplete(opts);
        });
    };
    $('#s').googleSuggest();
})(jQuery);

应该在Wordpress搜索字段中添加Google建议自动填充搜索选项。问题是,当您选择建议的搜索字符串时,表单只是填充,但未提交。您需要再次按Enter才能提交。所以,问题是如何在select上添加submit。

谢谢。

============================================== < / p>

编辑:我回到此代码并取得了一些进展。我添加了以下代码:

      opts.select = function(opts) {
      $(this).autocomplete(opts).parents('form').submit();
  }

在“返回”行之前;

    return this.each(function () {
..

现在,如果我使用箭头向上和向下移动自动建议结果,并按Enter键,表单将使用正确的字符串提交。

但是,如果使用鼠标单击建议,则会提交键入的原始搜索字符串。行为的一个例子如下:

在表单中输入的搜索字符串:一两 自动建议:

一二三

一二三四

一二三四五。

当我用鼠标单击其中一个自动建议时,让我们说“一二三四”,它会进入搜索字段。表单已提交,但后来证明它是使用原始类型字符串“one two”提交的。

感谢您提出的任何建议。

=======================================

我终于设法用替代代码解决了这个问题:

var suggestCallBack; // global var for autocomplete jsonp

jQuery(document).ready(function ($) {
    $("#s").autocomplete({
      select: function (event, ui) {
         var selectedObj = ui.item;              
         $("#s").val(selectedObj.value);
         $('#cse-search-box').submit();
         },
        source: function(request, response) {
            $.getJSON("http://suggestqueries.google.com/complete/search?callback=?",
                { 
                  "hl":"bg", // Language                  
                  "jsonp":"suggestCallBack", // jsonp callback function name
                  "q":request.term, // query term
                  "client":"youtube" // force youtube style response, i.e. jsonp
                }
            );
            suggestCallBack = function (data) {
                var suggestions = [];
                $.each(data[1], function(key, val) {
                    suggestions.push({"value":val[0]});
                });
                suggestions.length = 10; // prune suggestions list to only 5 items
                response(suggestions);


            };


        },
    });


});

代码由用户PSR在另一个问题中提供。它必须进行一些修改。原始代码以:

开头
var suggestCallBack; // global var for autocomplete jsonp

$(document).ready(function () {

对于Wordpress,它必须从:

开始
var suggestCallBack; // global var for autocomplete jsonp

jQuery(document).ready(function ($) {

案件结案。

0 个答案:

没有答案