我有两个选择标签。他们的ID是“study-phase”和“study-year”。 我想在学习阶段处理一段CSS代码的值。
HTML:
<select name="study-phase" onchange="myFunction()" id="study-phase" class="sp-input">
<option value=""></option>
<option id="pri" value="pri">Primary</option>
<option id="pre" value="pre">Prep</option>
<option id="sec" value="sec">Secondary</option>
</select>
<select name="study-year" id="study-year" class="sp-input">
<option value=""></option>
<option id="a" value="aa">Grade 1</option>
<option id="b" value="">Grade 2</option>
<option id="c" value="">Grade 3</option>
<option id="d" value="">Grade 4</option>
<option id="e" value="">Grade 5</option>
<option id="f" value="">Grade 6</option>
<option id="g" value="">Grade 7</option>
<option id="h" value="">Grade 8</option>
<option id="i" value="">Grade 9</option>
<option id="j" value="">Grade 10</option>
</select>
<style type="text/css">
#a , #b , #c , #d , #f , #g , #h , #j , #k , #e , #i {
display: none;
}
</style>
JS:
$(function(myFunction()){
if (document.getElementById("study-phase").value == "pri") {
document.getElementById("a").style.display = "block";
}
});
在运行代码后,我想要的 css 代码不会启动。 这里有什么问题?
最佳答案
$(function(myFunction()){
if (document.getElementById("study-phase").value == "pri") {
document.getElementById("a").style.display = "block";
}});
报错
Uncaught SyntaxError: Unexpected token (
除了你修改你的代码如下它工作,因为它是 vanillaJs 你不需要 jquery
function myFunction() {
if (document.getElementById("study-phase").value == "pri") {
document.getElementById("a").style.display = "block";
}
};
<select name="study-phase" onchange="myFunction()" id="study-phase" class="sp-input">
<option value=""></option>
<option id="pri" value="pri">Primary</option>
<option id="pre" value="pre">Prep</option>
<option id="sec" value="sec">Secondary</option>
</select>
<select name="study-year" id="study-year" class="sp-input">
<option value=""></option>
<option id="a" value="aa">Grade 1</option>
<option id="b" value="">Grade 2</option>
<option id="c" value="">Grade 3</option>
<option id="d" value="">Grade 4</option>
<option id="e" value="">Grade 5</option>
<option id="f" value="">Grade 6</option>
<option id="g" value="">Grade 7</option>
<option id="h" value="">Grade 8</option>
<option id="i" value="">Grade 9</option>
<option id="j" value="">Grade 10</option>
</select>
<style type="text/css">
#a,
#b,
#c,
#d,
#f,
#g,
#h,
#j,
#k,
#e,
#i {
display: none;
}
</style>
关于javascript - onchange =""在选择标签中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44392187/