Question

我正在使用优秀的DropKick jQuery plugin作为网站搜索工具的一部分。 DropKick为选择框设置了样式，用户可以使用该框选择要搜索的网站。谷歌自定义搜索正在使用，我已成功告诉DropKick更改隐藏的“#cx”字段的值 - #cx字段告诉谷歌使用哪个搜索帐户。

这是HTML：

<form action="http://example1.com/search/" method="get" id="cse-search-box">
    <fieldset>
        <input type="hidden" name="cx" id="cx" value="custom_search_account_1" />
        <input type="hidden" name="cof" value="FORID:11" />
        <input type="hidden" name="ie" value="UTF-8" />            
        <div class="keywords">
            <label for="keywords">Search</label>
            <input type="text" name="q" id="keywords" class="search text" />
        </div>
        <select name="dk" class="dk">
            <option value="custom_search_account_1">Search website 1</option>
            <option value="custom_search_account_2">Search website 2</option>
            <option value="custom_search_account_3">Search website 3</option>
        </select>
        <input type="image" class="button" src="imgurl" alt="Search" name="sa" />
    </fieldset>
</form>

以下是工作jQuery代码，它根据用户选择的搜索引擎更改隐藏的“#cx”字段的值：

$('.dk').dropkick({
    change: function (value, label) {
        var x = $(this).val();                
        $('#cx').val(x);
    }
});

这一切都很棒。但是，还需要根据用户的选择更改表单操作。这可以使用这个插件吗？如果是这样，我需要对jQuery代码进行哪些更改？我已经用这个推动了我的知识极限！

提前感谢您的任何帮助。

干杯

Answer 1

更改操作方法就像更改任何其他属性一样简单。因此，在.change方法中，只需检查并更改符合值的操作。

Here's a fiddle

$('.dk').dropkick({
    change: function (value, label) {
        var x = $(this).val();                
        var action;
        $('#cx').val(x);

        if (x == 'custom_search_account_1') { action = 'action1'; }
        else if (x == 'custom_search_account_2') { action = 'action2'; }
        else if (x == 'custom_search_account_2') { action = 'action2'; }


        $('#cse-search-box').attr('action', action);

     }
});

使用DropKick jQuery插件创建多个更改回调

1 个答案: