javascript - 在测验结束时显示用户答案

Question

我创建了一个简单的测验，并将用户的答案存储在数据库中。我可以访问 json 格式的答案，如下所示:

{
    "form":{
        "1":{
            "M1_Q1PRE":{
                "a1":"a1"
            }
        },
        "2":{
            "M1_Q2PRE":{
               "a2":"a2"
            }
        },
        "3":{
            "M1_Q3PRE":{
                "a2":"a2",
                "a4":"a4"
            }
         }
    }
}

(问题 3 是多选复选框)

我正在尝试在测验结束时构建一个页面，该页面将显示所有问题以及用户选择的所选答案。我想对最后一页进行硬编码:

<p>Question One</p>
<ol type="a">
    <li>
        <label>
            <input type="radio" name="M1_Q1PRE" value="a1"> answer a
        </label>
    </li>
    <li>
        <label>
            <input type="radio" name="M1_Q1PRE" value="a2"> answer b
        </label>
    </li>
</ol>
<p>Question Two</p>
<ol type="a">
    <li>
        <label>
            <input type="radio" name="M1_Q2PRE" value="a1"> answer a
        </label>
    </li>
    <li>
        <label>
            <input type="radio" name="M1_Q2PRE" value="a2"> answer b
        </label>
    </li>
</ol>
<p>Question Three</p>
<ol type="a">
    <li>
        <label>
            <input type="checkbox" name="M1_Q3PRE" value="a1"> answer a
        </label>
    </li>
    <li>
        <label>
            <input type="checkbox" name="M1_Q3PRE" value="a2"> answer b
        </label>
    </li>
    <li>
        <label>
            <input type="checkbox" name="M1_Q3PRE" value="a3"> answer c
        </label>
    </li>
    <li>
        <label>
            <input type="checkbox" name="M1_Q3PRE" value="a4"> answer d
        </label>
    </li>
</ol>

我想做的是突出显示/检查用户使用 json 结果选择的答案。我无法编辑 json，因为后端是为其他东西构建的，我正在尝试将其重新用于此测验。有谁知道解析 json 并使用它自动填充用户答案的​​方法吗？

这是一个 jsfiddle:http://jsfiddle.net/mtca9kax/

谢谢， S

编辑

http://jsfiddle.net/mtca9kax/2/

我更新了我的 fiddle 以包含更准确的 json 响应。还有一些问题有多个答案(请参阅 Q2……很多 T/F)。我已经开始工作了，但不知道如何遍历数据。

Answer 1

我会这样做:

您必须循环进入您的 json 响应，并使用这些值来选择正确的答案。

$.each(results.form, function (ind, val) {
    $.each(val, function (inde, value) {
        $.each(value, function (index, radio) {
            //console.log(radio);
            $('input[name="'+ inde +'"][value="'+ radio +'"]').prop("checked", true);
        });
    });
});

FIDDLE .