首页 > 解决方案 > 在javascript中突出显示选定的项目

问题描述

我正在尝试使用选定的列表项从其他网页打开一个网页。它可以工作,但列表不会向下滚动并从第一项开始。

第一页.html

<!DOCTYPE html>
<html>
<body>

<div id="result"></div>

<script>
// Check browser support
if (typeof(Storage) !== "undefined") {
  // Store
  localStorage.setItem("imname", "LB_1_000566");
  // Retrieve
  document.getElementById("result").innerHTML = localStorage.getItem("imname");
} else {
  document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage...";
}
window.open("s2.html");
</script>

</body>
</html>

第二页.html

<!DOCTYPE html>
<html>
<body>

<select id="ImSelect"  size="4" >
  <option value="LB_1_000561">LB_1_000561</option>
  <option value="LB_1_000562">LB_1_000562</option>
  <option value="LB_1_000563">LB_1_000563</option>
  <option value="LB_1_000564">LB_1_000564</option>
  <option value="LB_1_000565">LB_1_000565</option>
  <option value="LB_1_000566">LB_1_000566</option>
  <option value="LB_1_000567">LB_1_000567</option>
  <option value="LB_1_000568">LB_1_000568</option>
  <option value="LB_1_000569">LB_1_000569</option>
  <option value="LB_1_000570">LB_1_000570</option>
  <option value="LB_1_000571">LB_1_000571</option>
  <option value="LB_1_000572">LB_1_000572</option>
  <option value="LB_1_000573">LB_1_000573</option>  
</select>

<p id="imstr"></p>

<script>   
            document.getElementById("imstr").innerText=localStorage.getItem("imname"); 

 </script>

</body>
</html>

我希望这样查看我的列表列表显示

问题 2:您能否建议替代本地存储从第一个网页调用网页 2。

标签: javascripthtml

解决方案


您可以通过以下方式设置选择标签的选定值

document.getElementById("ImSelect").value = localStorage.getItem("imname");

要更改本地存储,您可以通过查询字符串传递

window.open("s2.html?imname=LB_1_000566");

并使用

const urlParams = new URLSearchParams(window.location.search); urlParams.get('imname');

<!DOCTYPE html>
<html>
<body>

<select id="ImSelect"  size="6" onchange"getvalue()">
  <option value="LB_1_000561">LB_1_000561</option>
  <option value="LB_1_000562">LB_1_000562</option>
  <option value="LB_1_000563">LB_1_000563</option>
  <option value="LB_1_000564">LB_1_000564</option>
  <option value="LB_1_000565">LB_1_000565</option>
  <option value="LB_1_000566">LB_1_000566</option>
  <option value="LB_1_000567">LB_1_000567</option>
  <option value="LB_1_000568">LB_1_000568</option>
  <option value="LB_1_000569">LB_1_000569</option>
    <option value="LB_1_000570">LB_1_000570</option>
  <option value="LB_1_000571">LB_1_000571</option>
  <option value="LB_1_000572">LB_1_000572</option>
  <option value="LB_1_000573">LB_1_000573</option>  
</select>

<p id="imstr"></p>

<script>   
            document.getElementById("imstr").innerText='LB_1_000566'; 
            document.getElementById("ImSelect").value = 'LB_1_000566';

 </script>

</body>
</html>


推荐阅读