如何基于下拉选择建立网址查询字符串？

我正在尝试基于我正在处理的电子商务网站的几个不同参数动态创建一个URL查询字符串。该站点位于SaaS平台上，因此服务器端编码/脚本编写不存在问题。如何基于下拉选择建立网址查询字符串？

要求：

客户希望能够基于“完成”进行搜索 - 如铬，铜等，并在“条件”（全新/二手/翻新的实例）。

应该可以在URL字符串中添加/删除过滤器，而不会影响其他变量（例如？find = search-term，& category = 1234等）。

当前困难（S）：

现在我不能想出一个办法去构造动态的基础上，下拉菜单选择还是如何让下拉选择URL字符串，直到另一个选项被选中页面加载后仍然存在。

URL实例搜索查询结构：http://www.domain.com/search.aspx?find=search-term&category=1234&bath-finish=chrome

例如当前的标记（S）：

这是我与工作的下拉列表中选择HTML至今只是“完成“ 选项。

<select id="searchbox" name="URL"> 
<option>Choose Filter ...</option> 
<option value="&bath-finish=Chrome">Chrome</option> 
<option value="&bath-finish=Bronze">Bronze</option> 
<option value="&bath-finish=Black">Black</option> 
<option value="&bath-finish=Brass">Brass</option> 
<option value="&bath-finish=Copper">Copper</option> 
<option value="&bath-finish=Nickel">Nickel</option> 
<option value="&bath-finish=Stainless-Steel">Stainless Steel</option> 
<option value="&bath-finish=Gold">Gold</option> 
<option value="&bath-finish=Silver">Silver</option> 
<option value="&bath-finish=Brown">Brown</option> 
<option value="&bath-finish=White">White</option> 
<option value="&bath-finish=Almond">Almond</option> 
<option value="&bath-finish=Bisquit">Bisquit</option> 
<option value="&bath-finish=Blue">Blue</option> 
<option value="&bath-finish=Clear">Clear</option> 
<option value="&bath-finish=Clear-Glass">Clear Glass</option> 
<option value="&bath-finish=Wood">Wood</option> 
<option value="&bath-finish=Green">Green</option> 
<option value="&bath-finish=Grey">Grey</option> 
<option value="&bath-finish=Satin">Satin</option> 
<option value="&bath-finish=Oil-Rubbed">Oil Rubbed</option> 
</select>

这是我曾试图使至今脚本（仅涉及单一过滤器）：

<script> 
var selectFilter= $('#searchbox').val(); 
$('#searchbox').on("change", function(e){ 
    document.location.href = 'http://www.domain.com/search.aspx?log=false' + selectFilter; 
}); 
</script>

，我现在遇到的主要问题是，该脚本不似乎从下拉框中读取选定的选项，我不是100％确定为什么。理想情况下，我希望URL是非常模块化的，以便选择对URL字符串有非常严格的控制。

实施例：

domain.com/search.aspx?find=search-term &滤波器=选定的滤波器值

其中“选择滤波器值”，在基于该选择下拉框。

来源

2013-11-05 Ian Svoboda

你设置'selectFilter'当页面加载，而不是当用户从菜单中选择。 – Barmar

尝试这样的事情

$('#searchbox').on("change", function(e){ 
     var selectFilter= $(this).val(); 
     document.location.href = 'http://www.domain.com/search.aspx?log=false' + selectFilter; 
    });

来源

2013-11-05 05:56:22

非常感谢！我觉得我只是在犯一个愚蠢的错误，而事实上我是这样。你知道如何让下拉值在页面重新加载之后保持不变吗？我猜不是最大的交易，但它会有所帮助 –

希望它可以帮助你，

   <script type="text/javascript"> 
       $(function(){ 
        $('#searchbox').on("change", function(){ 
         var selectFilter= $(this).val(); 
         document.location.href = 'http://www.domain.com/search.aspx?log=false' + selectFilter; 
        }); 
       }); 
      </script>

来源

2013-11-05 06:00:20

如何基于下拉选择建立网址查询字符串？

回答

相关问题