处理多个表单提交

时间:2019-03-18 20:08:18

标签: javascript jquery forms handle

我是一个学习新东西的新手。我正在尝试处理两种形式,但无法弄清楚如何以不同方式处理第二种形式。它使用1st形式处理任何内容。这是代码:

<div class="body questionnaire-container">
            <div class="content">
                <h2 id="questionNumero"></h2>
                <p id="question"></p>
                <form class="form" id="question-form">
                    <div>
                        <input type="radio" name="question" id="answerA" value="A">
                        <label class="answerA"></label>
                    </div>
                    <div>
                        <input type="radio" name="question" id="answerB" value="B">
                        <label class="answerB"></label>
                    </div>
                    <div>
                        <input type="radio" name="question" id="answerC" value="C">
                        <label class="answerC"></label>
                    </div>
                    <div>
                        <input type="radio" name="question" id="answerD" value="D">
                        <label class="answerD"></label>
                    </div>
                    <button type="submit" id="submit" class="submit">Next</button>
                </form>
            </div>
            <div class="barre-progression">
                <h2>Progrès</h2>
                <progress class="progression" value="0" max="10">
            </div>
        </div>

        <div class="body weaponquestionnaire-container">
            <div class="content">
                <h2 id="questionNumero"></h2>
                <p id="question"></p>
                <form class="form" id="questionweap-form">
                    <div>
                        <input type="radio" name="question" id="answerA" value="A">
                        <label class="answerA"></label>
                    </div>
                    <div>
                        <input type="radio" name="question" id="answerB" value="B">
                        <label class="answerB"></label>
                    </div>
                    <div>
                        <input type="radio" name="question" id="answerC" value="C">
                        <label class="answerC"></label>
                    </div>
                    <div>
                        <input type="radio" name="question" id="answerD" value="D">
                        <label class="answerD"></label>
                    </div>
                    <button type="submit" id="chuj" class="questionweap-form">Next</button>
                </form>
            </div>
            <div class="barre-progression">
                <h2>Progrès</h2>
                <progress class="progression" value="0" max="10">
            </div>
        </div>


// Handle Form Submits
$("#question-form").submit(function (e) {
e.preventDefault();
alert( "It's broken again!" );

if (questionNumber != nbQuestionToAnswer) {
    //question 1 to 9: pushing answer in array
    closeAll();
    userAnswer.push($('input[name="question"]:checked').val());
    questionNumber++;
    openQuestionnaire();
} else {
    // question 10: comparing arrays and sending number of good answers
    userAnswer.push($('input[name="question"]:checked').val());
    var nbGoodAnswer = 0;
    for (i = 0; i < nbQuestionToAnswer; i++) {
        if (userAnswer[i] == goodAnswer[i]) {
            nbGoodAnswer++;
        }
    }

    closeAll();
    if (nbGoodAnswer >= nbAnswerNeeded) {
        openResultGood();
    } else {
        openResultBad();
    }
}

return false;
});



$("#questionweap-form").submit(function (e) {
    e.preventDefault();
    alert( "It worked, finally." );

if (questionNumber != nbQuestionToAnswer) {
    //question 1 to 9: pushing answer in array
    closeAll();
    userAnswer.push($('input[name="question"]:checked').val());
    questionNumber++;
    openQuestionnaireWeapon();
} else {
    // question 10: comparing arrays and sending number of good answers
    userAnswer.push($('input[name="question"]:checked').val());
    var nbGoodAnswer = 0;
    for (i = 0; i < nbQuestionToAnswer; i++) {
        if (userAnswer[i] == goodAnswer[i]) {
            nbGoodAnswer++;
        }
    }

    closeAll();
    if (nbGoodAnswer >= nbAnswerNeeded) {
        openResultGood();
    } else {
        openResultBad();
    }
}

return false;
});

即使尝试提交“ questionweap-form”,它也会一直提交“ question-form”

我已经寻找了数小时找不到任何提示的任何提示,因此将不胜感激!

0 个答案:

没有答案