jQuery重定向基于两个下拉菜单

jQuery redirect based on two drop downs

本文关键字：下拉菜单 于两个 重定向 jQuery      更新时间：2023-09-26

我有一些问题与我基于两个下拉框创建的搜索表单。很简单，但是，我似乎找不到问题。我还是个新手。

这里是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);
    });
});

一旦脚本被添加到站点的页脚，我得到一个永不结束的循环，几乎就像如果函数在实际单击按钮之前触发。

没有必要从我可以看到做一个POST请求-只是设置window.location.href也包装你的jQuery在IIFE和传递$作为参数可以是一个方便的方式，使$可用，如果你需要在无冲突模式下使用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));
相关文章：