Question

当用户点击链接时，我想将它们发送到另一个带有下拉列表的页面，预先选择与他们点击的链接相对应。例如，如果他们选择了商品＆＃34;的链接，我想将它们发送到另一个页面，其中包含为＆＃34;商品选择的下拉菜单，而不是其他选择的类别，例如＆＃34;所有＆＃34;，＆＃34;销售＆＃34;，＆＃34;架构＆＃34;我怎么能这样做？

Answer 1

您可以通过向第一页链接添加参数然后在第二页上解析它们以在选择输入中设置所选选项来实现此目的，请尝试以下示例：

page1.html

<html>
<body>
<a href="page2.html?category=merchandise">Merchandise</a>
<a href="page2.html?category=all">All</a>
<a href="page2.html?category=sales">Sales</a>
<a href="page2.html?category=architecture">Architecture</a>
</body>
</html>

page2.html

<html>
<head>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
    <script>
    $(document).ready(function(){
        var selectedCategory = getUrlParameter("category");
        $('select').val(selectedCategory);
    });

    function getUrlParameter(sParam)
    {
        var sPageURL = window.location.search.substring(1);
        var sURLVariables = sPageURL.split('&');
        for (var i = 0; i < sURLVariables.length; i++) 
        {
            var sParameterName = sURLVariables[i].split('=');
            if (sParameterName[0] == sParam) 
            {
                return sParameterName[1];
            }
        }
    }    

    </script>
</head>
<body>

<select>
<option value="merchandise" >Merchandise</option>
<option value="all" >All</option>
<option value="sales" >Sales</option>
<option value="architecture" >Architecture</option>
</select>
</body>
</html>

Answer 2

你可以试试这个：

test.php的

<!DOCTYPE html>
<html>
<head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
<script>
  $(document).ready(function(){
$('a').click(function(){
      localStorage.setItem("category",$(this).text());
});
  });
</script>
</head>
<body>
<a href="submit.php">Merchandise</a>
<a href="submit.php">All</a>
<a href="submit.php">Sales</a>
<a href="submit.php">Architecture</a>
 </body>
</html>

submit.php

<html>
<head>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
    <script>

    window.onload = function() {
        $('select option[value="' + localStorage.getItem("category") + '"]').prop('selected', true);
    }

    </script>
</head>
<body > 
<select>
<option value="merchandise" >Merchandise</option>
<option value="all" >All</option>
<option value="sales" >Sales</option>
<option value="architecture" >Architecture</option>
</select>
</body>
</html>

链接到下拉列表中的选择

2 个答案: