html判断如果下拉框id="xqdmc"中xqdmc 的值为1 , 复选框<div class="col-sm-9" th:with="type=${@dict.getType('xqd_jcy_lb')}"> <label th:each="dict : ${type}" class="check-box"> <input name="fenlei" type="checkbox" th:value="${dict.dictValue}" th:text="${dict.dictLabel}"> </label> </div>可选可见的值为12,13,14,15并默认是选中状态其它值不可选,如果xqdmc 的值为2复选框<div class="col-sm-9" th:with="type=${@dict.getType('xqd_jcy_lb')}"> <label th:each="dict : ${type}" class="check-box"> <input name="fenlei" type="checkbox" th:value="${dict.dictValue}" th:text="${dict.dictLabel}"> </label> </div>可选可见的值为12并默认是选中状态其它值不可选
时间: 2023-07-02 17:04:39 浏览: 47
你可以使用 JavaScript 代码来实现该功能。首先,你需要获取下拉框的值,然后根据其值来设置复选框的可选可见状态。下面是一个可能的实现:
```javascript
// 获取下拉框元素
var xqdmc = document.getElementById("xqdmc");
// 获取复选框元素
var fenlei = document.getElementsByName("fenlei");
// 设置复选框的可选可见状态
function setFenleiVisibility() {
// 如果下拉框的值为1
if (xqdmc.value === "1") {
// 遍历复选框元素,设置可选可见状态
for (var i = 0; i < fenlei.length; i++) {
var value = fenlei[i].value;
if (value === "12" || value === "13" || value === "14" || value === "15") {
fenlei[i].checked = true;
fenlei[i].disabled = false;
fenlei[i].parentNode.style.display = "";
} else {
fenlei[i].checked = false;
fenlei[i].disabled = true;
fenlei[i].parentNode.style.display = "none";
}
}
}
// 如果下拉框的值为2
else if (xqdmc.value === "2") {
// 遍历复选框元素,设置可选可见状态
for (var i = 0; i < fenlei.length; i++) {
var value = fenlei[i].value;
if (value === "12") {
fenlei[i].checked = true;
fenlei[i].disabled = false;
fenlei[i].parentNode.style.display = "";
} else {
fenlei[i].checked = false;
fenlei[i].disabled = true;
fenlei[i].parentNode.style.display = "none";
}
}
}
}
// 初始化时设置复选框的可选可见状态
setFenleiVisibility();
// 监听下拉框的变化事件,重新设置复选框的可选可见状态
xqdmc.addEventListener("change", setFenleiVisibility);
```
在上面的代码中,首先获取了下拉框和复选框的元素,然后定义了一个 `setFenleiVisibility` 函数来设置复选框的可选可见状态。在函数中,根据下拉框的值来遍历复选框元素,设置它们的选中状态、可用状态和可见状态。同时,在初始化时调用该函数来设置初始状态,并在下拉框变化时重新调用该函数来更新复选框的状态。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)