时间戳

首页 > 解决方案 > 如何显示从一个页面中选择的下拉菜单将在另一个页面中处于活动状态

javascript - 如何显示从一个页面中选择的下拉菜单将在另一个页面中处于活动状态

问题描述

我为索引页面中的某些页面创建了一个下拉列表，从下拉列表中选择一个页面后，页面将重定向到相应的页面。下面是代码：

一世。索引.html

<script>
function DropList() {
var n = document.getElementById("sel").options.length;
document.getElementById("sel").size = n;
}

function handleSelect(elm){
window.location = elm.value;
}
</script>
<script 
  src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 
  </script>
<div>
    <select id="sel" onchange="javascript:handleSelect(this)">            
<option value="page1.html/">page1</option>
<option value="page2.html/">page2</option>
<option value="page3.html/">page3</option>
<option value="page4.html/">page4</option>
</select>
</div>

现在从下拉列表中选择 page1 后，页面将重定向到 page1.html，我在其中给出了相同的下拉代码，如下所示：

ii.Page1.html

<div>
    <select id="sel" onchange="javascript:handleSelect(this)">            
<option value="page1.html/">page1</option>
<option value="page2.html/">page2</option>
<option value="page3.html/">page3</option>
<option value="page4.html/">page4</option>
</select>
</div>

我想在 page1.html 页面中显示下拉菜单中的 page1 选项处于活动状态（在下拉菜单中默认选择）。因为它在从索引页面中选择 page1 后被重定向。请帮助我如何将页面设置为活动状态。

标签： javascriptjqueryhtmlcss

解决方案

事实上，您不能跨页面传递 javascript 变量。但是您可以通过使用网址“作弊”来做到这一点。

您的选项将 url 的结尾作为值window.location.pathname。

有了它，您可以找到并选择正确的选项。

var page = window.location.pathname;
var select = document.getElementById('sel');

var opts = sel.options;
for (var opt, j = 0; opt = opts[j]; j++) {
    if (opt.value == val) {
      sel.selectedIndex = j;
      break;
    }
}

这是未经测试的代码，我将此问题用于选择部分。但我希望我能给你一个线索。

推荐阅读