火狐浏览器可以正常运行,chrome或edge就不行
html:
<div class="mb-3">
<select class="form-select">
<option id="xsa" selected>选择模式</option>
<option id="xsclv" value="0">1</option>
<option id="xaclv" value="0">2</option>
</select>
</div>
<form>
<div class="sclv" style="display: none;">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">1</span>
<input type="text" class="form-control" placeholder="12" aria-label="title"
aria-describedby="basic-addon1">
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">1</span>
<input type="text" class="form-control" placeholder="12"
aria-label="title" aria-describedby="basic-addon1">
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">1</span>
<input type="text" class="form-control" placeholder="12"
aria-label="title" aria-describedby="basic-addon1">
</div>
</div>
<div class="aclv" style="display: none;">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">2</span>
<input type="text" class="form-control" placeholder="23" aria-label="title"
aria-describedby="basic-addon1">
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">2</span>
<input type="text" class="form-control" placeholder="23" aria-label="title"
aria-describedby="basic-addon1">
</div>
</div>
</form>
jQuery代码:
<script type="text/javascript">
$(function () {
$("#xsa").click(function(){
$(".sclv").hide();
$(".aclv").hide();
});
$("#xsclv").click(function(){
$(".sclv").show();
$(".aclv").hide();
});
$("#xaclv").click(function(){
$(".sclv").hide();
$(".aclv").show();
});
});
</script>
选择1会显示sclv,选择2会显示aclv
火狐浏览器可以正常运行,chrome或edge就不行,也不会报错
本帖最后由 Wddxg 于 2022-11-13 15:47 编辑
你应该使用select标签的change事件来获取value值做出判断,至于option的点击事件是否生效,那得看标签的设计标准或者浏览器的处理了
$(function () {
$(".form-select").change(function () {
console.log($(".form-select").val())
switch ($(".form-select").val()) {
case "1":
$(".sclv").show();
$(".aclv").hide();
break;
case "2":
$(".sclv").hide();
$(".aclv").show();
break;
default:
$(".sclv").hide();
$(".aclv").hide();
}
})
}); Wddxg 发表于 2022-11-13 15:40
你应该使用select标签的change事件来获取value值做出判断,至于option的点击事件是否生效,那得看标签的设 ...
蟹蟹٩('ω')و,解决了 感谢🙏
页:
[1]