我已经尝试了大约一个小时才能使此代码正常工作,但这只是在黑暗中的痛苦。
好的,让我们切入正题。我正在尝试创建一个选择字段,根据状态切换不同的 HTML 元素<select>
$(document).ready(function() {
$('#mySelect').change(function() {
let item1 = $("#item1");
let item2 = $("#item2");
let item3 = $("#item3");
switch ($('select[name=mySelect]').val()) {
case 1:
item1.show();
item2.hide();
item3.hide();
break;
case 2:
item1.hide();
item2.show();
item3.hide();
break;
case 3:
item1.hide();
item2.hide();
item3.show();
break;
default:
item1.hide();
item2.hide();
item3.hide();
break;
}
});
});Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="mySelect" name="mySelect">
<option value="0" disabled selected>-- Select your item--</option>
<option value="1">item1</option>
<option value="2">item2</option>
<option value="3">item3</option>
</select>
<div id='item1'>
<p> contents
</div>
<div id='item2'>
<p> text2</p>
</div>
<div …Run Code Online (Sandbox Code Playgroud)