Question

我正在建立一个小js测验游戏。使用下面的代码，用户选择一个答案，然后必须单击答案按钮进行提交，这将检查答案是否正确。换句话说，有两个步骤。首先，选择。第二，提交。我想知道是否有办法消除第二步，以便事件被选中。

如果有必要，这是一个小提琴。

我想我不知道如何为启动检查的所有选择框创建一般事件，但同时，能够检查选择以查看它是否正确，如果是感。

注意，游戏最终会使用像Underscore模板这样的东西来插入问题并回答字段中的选择，所以如果这会影响你的设置方式，请考虑它。

提前谢谢

HTML

 <fieldset id="question1">
        <legend>What is the answer to this question?</legend>
        <label><input type="radio" name="q1" value="right"> Right answer</label>
        <label><input type="radio" name="q1" value="wrong"> Wrong answer</label>
            <ul>

    </fieldset>

            <input type="button" id="answer">

JS

 document.getElementById("answer").onclick = validate;
    function validate() {
            var radios;
            var i;
            var right;
            radios = document.getElementById("question1").getElementsByTagName("input");

            right = false;
            for(i = 0; i < radios.length; i++) {
                    if(radios[i].value == "right" && radios[i].checked == true) {
                          right = true;
                    }
            }

            if(right) {
                    alert("You answered correctly");
            } else {
                    alert("Wrong answer");
            }
    }

更新，游戏的最终版本将使用Backbone，它支持此类活动

events:{ 'click #sayhello': 'validate'
    },

这个问题的前两个答案提出了一个“内联”解决方案，但我希望有一些适合骨干事件处理的东西。我将替换#sayhello以便在此代码中触发验证功能。

Answer 1

为每个单选按钮应用onclick处理程序：

<input type="radio" name="q1" value="right" onclick="validate">

fiddle here

Answer 2

试试这个：

<fieldset id="question1">
    <legend>What is the answer to this question?</legend>
    <label><input type="radio" name="q1" value="right" onclick="javascript:check('right')"/> Right answer</label>
    <label><input type="radio" name="q1" value="wrong" onclick="javascript:check('wrong')"/> Wrong answer</label>


<script>
    function check(answer){
        alert(answer+" answer");
    }

</script>

http://jsfiddle.net/D5H9z/3/

选择单选按钮时触发事件

2 个答案: