javascript - 如何根据 PHP/Jquery 中选中的复选框数量启用/禁用按钮？

Question

我知道这个问题之前已经被问过，我尝试查找类似的问题并获得一些解决方案，但我使用的代码已永久禁用提交按钮:(我希望在选择并禁用 3 个框时启用它否则(无需刷新页面)。这是一个非常小的问题，但我似乎无法弄清楚，有人可以帮我在我的代码中找到它吗？我对这些语言也很陌生，所以任何示例或描述都会不胜感激!

注意:我的复选框不是像 StackOverflow 上针对此问题的大多数示例那样在 HTML 中手动制作的。它们是从 mysql 中预先设置的数据库自动生成的。

    <h2>Select 3 of the following options:</h2>
        <form action="dm_courses.php" method="post">
        <div id="checkboxes">
        <?php
                $username = "root";
                $password = "";
                $hostname = "localhost";

                $dbname = "major_degrees";
                $str='';

                // Create connection
                $conn = new mysqli($hostname, $username, $password, $dbname);

                // Check connection
                if ($conn->connect_error) {
                    die("Connection failed: " . $conn->connect_error);
                } 

                $sql = "SELECT degree_name FROM majors";
                $result = $conn->query($sql);

                $out = '';
                $cnt = 0;
                if ($result->num_rows > 0) {
                    // output data of each row
                    while($row = $result->fetch_assoc()) {
                        $cnt++;
                        $out .= '<input id="cb_' .$cnt. '" class="checkChange" type="checkbox" name="check" value="ch" id="checky" />' .$row['degree_name']. '<br/>';

                    }
                    echo $out;  

                } 

        ?>

    </div>      
        </form>
        <input class="btn-checkout" type="submit" value="Submit" id="submitBtn" disabled="disabled"/>
        </body>

        <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
        <script>

            $('.checkChange').change(function() {
                var count = 0;
                var len = $("[name='check']:checked").length;               

                $('#checkboxes input:checked').each(function() {
                    count++;
                });

                if (count == 3) {
                    $('#checkboxes input:not(:checked)').each(function() {
                        $(this).attr("disabled", true);
                    });                 
                } 

                else {
                    $('#checkboxes input:not(:checked)').each(function() {
                        $(this).removeAttr('disabled');
                    });                                     
                }   

            });

        </script>

    </html>

Answer 1

经过一番努力和尝试，我终于明白了!

我必须添加以下代码来根据我选中的框数量启用/禁用提交按钮:

if ($(this).is(":checked") && count == 3) {
            $("#submitBtn").removeAttr("disabled");
    } else {
            $("#submitBtn").attr("disabled", "disabled");
    }