Javascript 链接到下拉列表中的选定内容_Javascript_Jquery_Html_Select_Drop Down Menu

Javascript 链接到下拉列表中的选定内容

javascript jquery html select drop-down-menu

Javascript 链接到下拉列表中的选定内容,javascript,jquery,html,select,drop-down-menu,Javascript,Jquery,Html,Select,Drop Down Menu,当用户单击一个链接时，我想将他们发送到另一个带有下拉列表的页面，该下拉列表是与他们单击的链接对应的预先选择的。例如，如果他们选择了一个指向商品的链接，我想将他们发送到另一个页面，并为商品选择一个下拉列表，而不是选择其他类别，如“所有”、“销售”、“架构”等。我如何才能做到这一点您可以通过向第一个页面链接添加参数，然后在第二个页面上解析这些参数来实现此目的，以在选择输入中设置所选选项，请尝试以下示例：页面1.html <html> <body> <a href="

当用户单击一个链接时，我想将他们发送到另一个带有下拉列表的页面，该下拉列表是与他们单击的链接对应的预先选择的。例如，如果他们选择了一个指向商品的链接，我想将他们发送到另一个页面，并为商品选择一个下拉列表，而不是选择其他类别，如“所有”、“销售”、“架构”等。我如何才能做到这一点

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

页面1.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>

页面2.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>

您可以尝试以下方法：

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>

php和html可以工作，css可以让它更漂亮，还可以添加一点javascript！这取决于您使用的JavaScript框架。使用JQuery和AngularJS有很多方法。您使用的是哪一个？可以使用url属性和jquery@eugene1832我正在使用Jquery。