我的应用程序由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>
答案 0 :(得分:0)
您的第二页应使用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>