javascript - CheckBox 被选中但未执行功能

Question

我目前正在使用 php 循环从数据库生成面板。在每个面板上都有一个复选框。选中后，它会选中可折叠面板中其下方的所有复选框。

当面板中的复选框被面板标题中的复选框选中时，它意味着运行一个函数来更新我的数据库，说明该框已被选中。当您按下可折叠面板并手动选中该框时，该功能会起作用。但是当您从更高级别选中该框并选中它下面的所有框时，它不会运行我放入的 onchange 函数。

有人能帮忙吗？

谢谢，克里斯蒂安

PHP:

foreach ($results3 as $table3) {
        $output_string .= "<div class=\"panel-inner\">\n";
        $output_string .= "<div class=\"row\">\n";
        $output_string .= "<div class=\"col-sm12\">\n";
        $output_string .= "<div class=\"panel-body\">\n";
        $output_string .= "<h4 class=\"panel-title\">\n";
        $output_string .= "<a>$table3[Call_Flow]</a>\n";
        $output_string .= "<input class=\"mycheckbox\" type=\"checkbox\" value=\"$table3[Test_ID]\" onchange=\"adds(tccb$j)\" id=\"tccb$j\"/>\n";
        $output_string .= "</h4>\n";
            $output_string .= "</div>\n";
        $output_string .= "<div id=\"collapseflow$j\" class=\"panel-body collapse\">\n";

HTML:

<div id="check">

    </div>

    <script>
    function adds(id) {

    var value = $(id).val()

        jQuery.ajax({
            url: "selection_update.php",
            data: {"value": value},
            type: "POST",
            dataType: 'json',
                success:function(responce){
                $("#check").html(responce);
            }
        });
    }
    </script>

编辑:

这是我用来检查所有子复选框的代码。

$output_string .= "<script type=\"text/javascript\" language=\"javascript\">\n";
$output_string .= "function checkCheckboxes( id, pID ){\n";
$output_string .= "$('#'+pID).find(':checkbox').each(function(){\n";
$output_string .= "jQuery(this).prop('checked', $('#' + id).is(':checked'));\n";
$output_string .= "});\n";     
$output_string .= "}\n";
$output_string .= "</script>\n";

Answer 1

那是因为 onchange 只对用户点击使用react，而不是简单的值变化。要解决此问题，您需要手动触发 onchange 函数。

因此，在您的 oarent 的 onchange 函数中，确保您选择了相关的子项并对它们调用 .onchange()。

这是一个示例，其中一个复选框改变了另一个，没有 .onchange() 调用:

https://jsfiddle.net/c1zwek1u/

这里是:

https://jsfiddle.net/c1zwek1u/1/

请注意，当子项的值发生变化时它会提醒您。

对于多个 child ，您只需遍历组并像这样分别调用每个 child :

https://jsfiddle.net/c1zwek1u/3/

在 Jquery 中，您可以像这样触发更改 $(selector).trigger('change');