我成功发送了复选框值，该值是选中复选框时的类别 ID，并在同一页面上显示与所选子类别相关的子类别，但当单击多个类别并再次取消选中所有子类别所在的类别之一时，我遇到了问题取消显示。当我随时检查和取消选中值时，我想取消仅显示未选中类别的子类别。这是我的代码希望你明白我的意思谢谢
**脸**
1
849<script>
function showUser(str) {
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML += this.responseText;
}
};
xmlhttp.open("POST","getsubcat.php?q="+str,true);
xmlhttp.send();
}
}
</script>
J查询
<script>
$(function() {
//code here
$('input[type=checkbox]').on('change', function() {
if($(this).is(':checked')) {
showUser($(this).val());
}
else{
showUser("");
}
});
});
</script>
类别复选框
<?php
foreach($cat as $row)
{
?>
<input class = "messageCheckbox" type = "checkbox" id = "check" value = "<?php echo $row["id"]; ?>">
<label for = "check"><?php echo $row["name"]; ?></label>
<?php
}
?>
<br>
<div id="txtHint"><b></b></div>
getsubcat.php
<?php
$q = intval($_GET['q']);
$result = $link->query("SELECT *
FROM subcat WHERE cat_id = '".$q."'");
?>
<div class = "checkbox">
<?php
while($row = mysqli_fetch_array($result)) {
?>
<input type="checkbox" id="sub_cat" name="sub_cat" value="<?php echo $row['subcat']; ?>">
<label for="sub_cat"> <?php echo $row['subcat']; ?></label><br>
<?php
}
?>
我正在尝试使用附加的j查询代码来解决问题，但是当我选中复选框时，它显示了所有选中复选框的子类别，但是当取消选中任何一个框时，这将取消显示所有子类别
Copyright 2014-2025 //m.sbmmt.com/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
问题是，当取消选中任何复选框时，您实际上会清除所有内容：
function showUser(str) { if (str == "") { document.getElementById("txtHint").innerHTML = ""; return; } ... } $('input[type=checkbox]').on('change', function() { if($(this).is(':checked')) { showUser($(this).val()); } else{ showUser(""); }要解决这个问题，您需要以某种方式识别给定 cat_id 的元素，例如您可以添加数据属性：
当您想要取消选中该复选框时，您可以使用该数据属性找到要删除的元素：
function hideUser(str) { $('[data-cat="' + str + '"]').remove(); } $('input[type=checkbox]').on('change', function() { const user = $(this).val(); if($(this).is(':checked')) { showUser(user); } else{ hideUser(user); } });