嗨,我有以下问题。 我希望用户选择一个选择面板的选项。 然后,在他单击按钮之后,他被带到另一个文件,在那里,他选择的值被放在一个变量中,然后显示出来。 重要的是,它是在一个新文件中打开的。 但在我的代码中,变量返回未定义。 下面是我的代码:
null
function myFunction() {
a=$("#mySelect").val();
switch(a){
case "Orange":
var b="Orange";
return b;
case "Apple":
var b="Apple";
return b;
case "Pineapple":
var b="Pineapple";
return b;
case "Banana":
var b="Banana";
return "Banana";
}
}
var test=myFunction();
$("button").on("click",blub);
function blub(){
window.open(
"/Users/Adrian/Desktop/jj.html",
'_blank'
);
}
<!DOCTYPE html>
<html>
<body>
<select id="mySelect">
<option value="Apple">
Apple
</option>
<option value="Orange">
Orange
</option>
<option value="Pineapple">
Pineapple
</option>
<option value="Banana">
Banana
</option>
</select>
<p class="bla">
Click the button to select the option element with index "2".
</p>
<p>
<b>
Note:
</b>
The index starts at 0.
</p>
<button>
Try it
</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
</script>
<script charset="utf-8" src="j.js">
</script>
<script charset="utf-8" src="jj.js">
</script>
</body>
</html>
null
null
$(".bla").html(test);
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p class="bla"></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="j.js" charset="utf-8"></script>
<script src="jj.js" charset="utf-8"></script>
</body>
</html>
null
您应该只在单击按钮时才获取select的值,而不是在页面加载时获取。 然后,您可以在SessionStorage
中设置它,以便另一个页面可以访问它。
第一页的JavaScript:
$("button").on("click", blub);
function blub() {
sessionStorage.setItem("value", $('#mySelect').val());
window.open(
"/Users/Adrian/Desktop/jj.html",
'_blank'
);
}
第二页的JavaScript:
$(".bla").text(sessionStorage.getItem('value'));