Question

我在基于两个下拉菜单创建的搜索表单中遇到了一些问题。很简单，但我似乎无法找到问题。我还是很绿。

这是html：

<form id="CustomSearch">
<select id="Location">
    <option value='northeast'>North East</option>
    <option value='west'>West</option>
    <option value='midwest'>Mid West</option>
    <option value='south'>South</option>
</select>

<select id="Style">
    <option value='industrial'>Industrial</option>
    <option value='farmhouse'>Farmhouse</option>
    <option value='contemporary'>Contemporary</option>
    <option value='beach+style'>Beach Style</option>
    <option value='traditional'>Tradtional</option>
</select>

<button id="DropSearch">

这是js：

var location = jQuery('#Location').val();
var style = jQuery('#Style').val();

jQuery(document).ready(function(){
    jQuery('#DropSearch').click(function (e){
        jQuery.post('http://showroomworldwide.com/?geodir_search=1&stype=gd_place&s=' + location + '&stype=gd_place&s=' + style);
    });
});

一旦脚本被添加到站点的页脚，我就会得到一个永无止境的循环，就像在实际点击按钮之前函数被触发一样。

Answer 1

没有必要从我所看到的做一个POST请求 - 只需设置window.location.href也将你的jQuery包装在IIFE中并传递$作为参数可以是一个方便的方式让你可以获得$你需要在noconflict模式下使用jQuery。

最后，@ ADyson提到您需要在事件处理程序中设置检索位置和样式，否则您将无法使用初始值。

 (function($){
        $(document).ready(function(){
            var location = $('#Location').val();
            var style = $('#Style').val();
            $('#DropSearch').click(function (e){
                window.location.href = 'http://showroomworldwide.com/?geodir_search=1&stype=gd_place&s=' + location + '&stype=gd_place&s=' + style; // Can't just reference location.href due to local variable
            });
        });
 }(jQuery));

基于两个下拉列表的jQuery重定向

1 个答案: