这是选择选项的代码;
<div class="modal-body row">
<form role="form" action="patient/addNew" class="clearfix" method="post" enctype="multipart/form-data">
<div class="form-group col-md-6">
<label for="exampleInputEmail1"><?php echo lang('categorie'); ?></label>
<select class="form-control m-bot15" name="categorie" value='' id="p_category">
<option value="#"> Sélectionner catégorie</option>
<?php foreach ($categories as $category) { ?>
<option value="category"><?php
if (!empty($setval)) {
if ($category->category == set_value('category')) {
echo 'selected';
}
}
if (!empty($patient->category)) {
if ($category->category == $patient->category) {
echo 'selected';
}
}
?> > <?php echo $category->category; ?> </option>
<?php } ?>
</select>
</div>
这是必须显示/隐藏的 div:
<label for="exampleInputEmail1"><?php echo lang('name_Us'); ?></label>
<input type="text" class="form-control" name="name_husband" id="nameUs" placeholder="">
<label for="exampleInputEmail1"><?php echo lang('number_pre'); ?></label>
<input type="number" class="form-control" name="number_pre" id="nbreEnf" placeholder="">
</div>
这是 JavaScript 代码:
$('.divUs').hide();
$(document.body).on('change', '#p_category', function () {
var v = $("select.p_category option:selected").val()
if (v == 'Fe_Ence') {
$('.divUs').show();
} else {
$('.divUs').hide();
}
});
});
我希望如果选择了元素(Fe_Ence),则可以显示 div,否则,它保持隐藏
例如,您可以使用 :has 选择器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="thingtohide">
<h1>Hello</h1>
</div>
<div id="checkbox">
<input type="checkbox">
</div>
<style>
body:has(#checkbox input:checked) #thingtohide {
visibility: hidden;
}
</style>
</body>
</html>
因此,如果父元素有一个选中的复选框,那么您可以定位与该父元素不同的子元素。