javascript - 在循环中测试自定义属性

Question

我有一个表格，我设置为测验。最终，我将更改它以计算完成后的测验的最终分数。但我被困在这一部分上。如果选中了正确的框，我想加一个点，如果选中一个错误的框，我想减去一个点。

正确答案的代码：

<input type="checkbox" name="q3" id="q1javascript" answer="true">

错误答案代码：

<input type="checkbox" name="q3" id="q3xhtml" answer="false">

Javascript 检查它：

function test() {
    var boxes = document.getElementsbyName('q3');
    var score = 0;
    var i = 0;
    while (i < 4) {
        var answer = boxes[i].getAttribute('answer');
        if (answer === 'true') {
            score++;
        }
        else {
            score--;
        }
        i++;
    }
    alert(score);
}

JSFiddle

Answer 1

试试这个 JSFiddle：http://jsfiddle.net/vCz2T/1/

复选框现在使用data-answer="true" 或data-answer="false"。任何像 answer 属性这样的自定义数据都应该以 data- 为前缀：

<input type="checkbox" name="q3" id="q3css" data-answer="true">

test() 函数已更改为：

function test() {
    var boxes = document.getElementsByName('q3');
    var score = 0;
    var i, box, answer;
    for (i = 0; i < boxes.length; i++) {
        box = boxes[i];
        if (box.checked) {
            answer = box.getAttribute('data-answer');
            if (answer === 'true') {
                score++;
            } else {
                score--;
            }
        }
    }
    alert(score);
}

你现在必须做getAttribute('data-answer')。此外，您应该检查box.checked，以便只计算选中的复选框。