问如何将所有复选框的值存储到一个数组中，并使用AJAX调用将其传递给PHP函数？

EN

$(checkbox).each(function(){
    if ( $(this).hasClass('checked') && $(btn).html() == 'Next Question' ) {
        answers.push($('.cb:checked').val()); // LOGIC ERROR
        next = true
    } 
    else if ($(this).hasClass('checked') && $(btn).html() == 'Submit Test') {
        submit = true
    }
});

if ( $(this).hasClass('checked') && $(btn).html() == 'Next Question' ) {
    answers.push($(this).val()); // modified line
    next = true
} 

$(document).on('ready', function(){
    var answers = [];
    $('.quiz-btn').click(function(e){
        // Bla bla bla
        answers.push(the_correct_value);
        // Bla bla bla
    });
}

$(document).on('ready', function(){
    (function(){ // Notice how this line starts with an open bracket
        var answers = [];
        $('.quiz-btn').click(function(e){
            // Bla bla bla
            answers.push(the_correct_value);
            // Bla bla bla
        });
    })(); // This line closes the open bracket above, 
          // then immediately runs the result with no arguments

    // the `answers` variable is unavailable in this scope
}

<div class="modal fade test-modal" id="Test">
    <div class="modal-dialog">
        <div class="modal-content">
            <form action="/student/submit-quiz" method="POST"><!-- Form tag -->
                <?php foreach($questions as $i => $question): ?>
                <div class="question">
                    <div class="modal-header">
                        <div class="row">
                            <h4>QUIZ</h4>
                        </div>
                    </div>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="quest">
                            <ul class="list-unstyled">
                                <?php foreach ($question->getAnsChoice as $answer): ?>
                                <li>
                                    <div class="checkbox">
                                        <input class="cb" type="checkbox" name="answer[]" value="<?= $answer->title ?>" />
                                        <?= $answer->title ?>
                                    </div>
                                </li>
                                <?php endforeach;  ?>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <p class="quest_num"><?= $question->number ?> of <?= count($questions) ?></p>
                    <?php $last = $question->number === count($questions) - 1; ?>
                    <!-- 
                    Ternary operators, used in these attributes, are like if statements:
                    if the first thing is true, return the second,
                    otherwise return the third.
                    -->
                    <input type="<?= $last ? 'submit' : 'button' ?>" class="btn button btn-lg quiz-btn" value="<?= $last ? 'Submit Test' : 'Next Question' ?>" />
                </div>
                <?php endforeach; ?>
            </form>
            <script>
                /*
                 * Where the real magic happens.
                 */
                $('form[action="/student/submit-quiz"]').on('submit', function(e) {
                    e.preventDefault();
                    data = new FormData(this);
                    $.ajax({
                        url: this.action,
                        data: data,
                        contentType: false,
                        processData: false,
                        type: 'POST',
                        success: function(response) {
                            // do something useful with the response
                            console.log(response);
                        },
                    });
                });

                $('form[action="/student/submit-quiz"] input[type="button"]').on('click', function(e) {
                    $(this).parents('.question').slideUp(500);
                    $(this).parents('.question').next('.question').delay(500).slideDown(500);
                });
            </script>
        </div>
    </div>
</div>