1 
<div class="question" id="question_0">
    <label>
        Something:
        <input type="radio" name="radyo" value="1" />
        <input type="radio" name="radyo" value="2" />
        <input type="radio" name="radyo" value="3" />
        <input type="radio" name="radyo" value="4" />
        <input type="radio" name="radyo" value="5" />
    </label>
</div>
<div class="question" id="question_1">
    <label>
        FFFF:
        <input type="radio" name="radyo" value="1" />
        <input type="radio" name="radyo" value="2" />
        <input type="radio" name="radyo" value="3" />
        <input type="radio" name="radyo" value="4" />
        <input type="radio" name="radyo" value="5" />
    </label>
</div>
<div class="question" id="question_2">
    <label>
        asdf:
        <input type="radio" name="radyo" value="6" />
        <input type="radio" name="radyo" value="2" />
        <input type="radio" name="radyo" value="3" />
        <input type="radio" name="radyo" value="4" />

    </label>
</div>
<button id="next" disabled="disabled">Next</button>

html

.question { display: none; }
#question_0 { display: block; }

css

$(document).ready(function() {

    /*
     * question: What question the user is currently on
     * trys: The amount of tries for the CURRENT question
     * answers: The answers for each questions. Matches with radio button values
     */
    var question = trys = 0,
        answers = [1, 6, 2];




    // When the user tries to click the next button (only applies when not disabled)
    $('#next').click(function() {

        // If the next question exists, transition to it
        if ($('#question_' + ++question).length) {
            $('#next').attr('disabled', 'disabled');
            $('#question_' + (question - 1)).fadeOut('fast', function()
                { $('#question_' + ++question).fadeIn('fast'); });
            trys = 0;

        // Else submit the form
        } else alert('submit form');  //$('form').submit(); ???
    });  




    // When the user clicks on a radio button (tries to answer a question)
    $('input[type="radio"]').click(function() {

        // If the answer does not equal what the user clicked on
        if ($(this).val() != answers[question]) {
            $('#next').attr('disabled', 'disabled');  //Disable the button
            ++trys;
            if (trys >= 3) {  //If the user tried 3 times, they fucked up
                $('#question_' + question + ' input').attr('disabled', 'disabled');
                alert('you fucked up');
            } else alert('wrong');  //If the user still has more tries tell them they're wrong

        // Else enable the ability to go to the next question
        } else $('#next').removeAttr('disabled');
    });

});

javascript

嘿，我有这个代码。您首先会看到一些东西，然后单击第一个单选按钮。你可以点击下一步。否则你会看到一些错误信息。三次错误尝试后，表单输入将被禁用。在下一部分中，您将看到另一个单选按钮。但这并不好。我以为我在答案数组中有答案，但我不明白为什么它没有任何提示？

4

1 回答 1

0

这里有一些提示：

  1. “下一个”按钮处理程序应该在传递到下一阶段后禁用按钮；
  2. 检查单选按钮值以匹配答案数组中某个阶段的任何值；
  3. 在开始时显示第一阶段；
于 2013-08-23T09:29:17.037 回答