导航到另一个HTML页面后，如何在下拉列表中显示所选值？

Question

我的应用程序由4个角色组成，这些角色将在下拉菜单中。 如果单击某个特定角色，它将导航到我提到的href链接。 我的问题是导航到第二个html页面后，该角色未在下拉列表中修复。 它继续仅显示第一个值。 我的第一个html：

     <select name="loginuser" id="loginuser">
       <option value="dash.html">first</option>
       <option value="dash1.html">second</option>
       <option value="dash2.html">third</option>
     </select>

  jquery:
     <script>
         $("#loginuser").change(function () {
         url = this.value;
         if (url !== "") {
            window.location = url;
          }
         });
      <script>

我的第二个html文件：

        <select name="loginuser" id="loginuser">
       <option value="dash.html">first</option>
       <option value="dash1.html">second</option>
       <option value="dash2.html">third</option>
     </select>

  jquery:
     <script>
         $("#loginuser").change(function () {
         url = this.value;
         if (url !== "") {
            window.location = url;
          }
         });
      <script>

Answer 1

您的第二页应该通过使用HTML具有的简单标准来显示选定的值。 您可以使用传递给URL的参数以某种方式存储或将其放置在页面服务器端，该选择在某种程度上是您如何传播该状态的选择。

 $("#loginuser").change(function() { url = this.value; if (url !== "") { window.location = url; } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <select name="loginuser" id="loginuser"> <option value="dash.html">first</option> <option value="dash1.html" selected="selected">second</option> <option value="dash2.html">third</option> </select> 

作为执行此操作的一种方法，您可以使用当前页面位置来设置所选页面。

 $("#loginuser").change(function() { url = this.value; if (url !== "") { window.location = url; } }); $(function() { let current = window.location.href; $('#loginuser').find('option').each(function() { let optionvalue = $(this).val(); let current = window.location.href; console.log(current); let isThisPage =(current.indexOf(optionvalue) > -1); $(this).prop("selected", isThisPage); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <select name="loginuser" id="loginuser"> <option value="dash.html">first</option> <option value="dash1.html" selected="selected">second</option> <option value="dash2.html">third</option> <option value="stacksnippets.net">thispage</option> </select>