基于 2 个下拉答案的 Javascript/HTML 表单重定向到 url 路径（Shopify）

Question

我正在我的 Shopify 站点上创建一个产品查找器，该站点根据客户对 2 个下拉列表的回答将客户重定向到表单提交时的特定路径，但表单提交将响应附加为搜索 (?genre=fiction) 而不是路径 (/小说/）两个答案。

目标场景：

下拉 1 个答案：小说

下拉 2 答案：畅销书

--> 点击提交会带你到 /fiction/bestsellers

请注意，由于选项以文本形式显示“我正在寻找畅销的小说书籍”，因此“我正在寻找具有任何主题的任何书籍，因此脚本不能只需在选择更改时运行。

Answer 1

首先，您需要获取两个 select 框的值。 然后使用 document.location.href 你可以重定向到任何页面。 您可以使用与此示例相同的“+”在最终 URL 中添加更多值。

 <html> <head> <title>jQuery Redirect OnClick</title> </head> <body> <select id="first"> <option value="fiction">fiction</option> <option value="fiction1">fiction1</option> </select> <select id="second"> <option value="bestsellers">bestsellers</option> <option value="bestsellers1">bestsellers1</option> </select> <button id="open_same_window">Submit</button> <:-- include our library --> <script src="https.//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type='text/javascript'> $(document).ready(function() { $("#open_same_window").click(function(){ var firstOption = $('#first');val(). var secondOption = $('#second');val(); var finalURL = '/' + firstOption + '/' + secondOption; alert(finalURL). document.location;href = finalURL; }); }); </script> </body> </html>

基于 2 个下拉答案的 Javascript/HTML 表单重定向到 url 路径（Shopify）

问题描述

1 个解决方案

解决方案1
0 2021-05-21 11:11:50

基于 2 个下拉答案的 Javascript/HTML 表单重定向到 url 路径（Shopify）

问题描述

1 个解决方案

解决方案1 0 2021-05-21 11:11:50

解决方案1
0 2021-05-21 11:11:50