<p>当我点击选择时，会弹出一个框，我们可以选择多个选项，包括父级和子级。当选项被选中后，立即在输入框中显示ID号码。当我们点击确定时，框将被隐藏。我希望每个框都在输入框中单独完成。这是我的HTML：</p>
<pre class="brush:php;toolbar:false;"><p>当我点击选择时，会弹出一个框，我们可以选择多个选项，包括父级和子级。当选项被选中后，立即在输入框中显示ID号码。当我们点击确定时，框将被隐藏。我希望每个框都在输入框中单独完成。这是我的HTML：</p>
<pre><code><button class="btn-select">选择一个...</button>
<div class="box" style="display:none">
<input type="checkbox" class="checkbox" value="1">复选框1
<input type="checkbox" class="checkbox" value="2">复选框2
<input type="text" class="input input-1" value="">
<button class="btn-ok">确定</button>
</div>
<button class="btn-select">选择两个（父级/子级）...</button>
<div class="box" style="display:none">
<ul class="father">
<li>
<input type="checkbox" class="checkbox" value="1">部分1
<ul class="children">
<li><input type="checkbox" class="checkbox" value="5">复选框5</li>
</ul></li>
<li>
<input type="checkbox" class="checkbox" value="2">部分2
<ul class="children">
<li><input type="checkbox" class="checkbox" value="7">复选框7</li>
<li><input type="checkbox" class="checkbox" value="8">复选框8</li>
</ul></li></ul>
<input type="text" class="input input-2" value="">
<button class="btn-ok">确定</button>
</div>
.
...选择三个...
..选择四个..
..
.</pre>
<p>这是我的JS（子级和父级）：</p>
<pre class="brush:php;toolbar:false;">handleChildren = function() {
var $checkbox = $(this);
var $checkboxChildren = $checkbox.parent();
$checkboxChildren.each(function() {
if ($checkbox.is(":checked")) {
$(this).prop("checked", "checked");
} else {
$(this).removeProp("checked");
}
});
};
handleParents = function(current) {
var $parent = $(current).closest(".children").closest("li").find("> input[type=checkbox]");
if ($parent.parent().find(".children input[type=checkbox]:checked").length > 0) {
$parent.prop("checked", "checked");
} else {
$parent.removeProp("checked");
}
handleParents($parent);
}
$("ul.father").find("input[type=checkbox]").each(function() {
$(input).on("click", handleChildren);
$(input).on("click", function() {
handleParents(this);
});
});</pre>
<p>这是我的JS：</p>
<pre class="brush:php;toolbar:false;">$(document).on('click', '.btn-ok', function(){
$('.box').hide()
});
$(document).on('click', '.btn-select', function(){
$('.box').hide()
$(this).next().show();
});
$(".checkbox").change(function() {
var text = "";
$(".checkbox:checked").each(function() {
text += $(this).val() + ",";
});
text = text.substring(0, text.length - 1);
$(this).next().val(text);
});</pre>
<p>现在控制台显示了一个错误：</p>
<pre class="brush:php;toolbar:false;">Uncaught InternalError: too much recursion
closest file:///var/www/html/jquey.js:1</pre></p>
1
897
![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
您的handleParents无条件地调用自身。