0

我正在尝试根据我正在处理的电子商务网站的几个不同参数动态创建 URL 查询字符串。该站点位于 SaaS 平台上，因此服务器端编码/脚本是不可能的。

要求：

客户希望能够根据“完成”（例如 Chrome、Bronze 等）和“条件”（例如新/旧/翻新）执行搜索。

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

当前难度：

现在我无法找到一种方法来根据下拉选择动态构建 URL 字符串，或者如何在页面加载后使下拉选择持续存在，直到选择另一个选项。

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

当前标记例如：

这是到目前为止我正在使用的下拉列表的 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&filter=selected-filter-value

其中“selected-filter-value”基于下拉框中的选择。

4

2 回答 2

2

尝试这样的事情

    $('#searchbox').on("change", function(e){
        var selectFilter= $(this).val();
      document.location.href = 'http://www.domain.com/search.aspx?log=false' + selectFilter;
    });
于 2013-11-05T05:56:22.640 回答
0

希望对你有帮助

              <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-05T06:00:20.603 回答