修改

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/

谢谢，小号

修改

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

我已经更新了我的小提琴，以包含更准确的json响应。还有一些问题有多个答案（见Q2 ......很多T / F）。我已经开始工作，但不知道如何循环数据。

Answer 1

您应该对JSON对象进行循环，并在具有相同名称的元素上映射键M1_Q1PRE（例如）。如果你不喜欢清楚的javascript使用jQuery库或相同（jQuery.each - for循环，jQuery（element）.val（） - 用于元素的设置值）。

Answer 2

我就是这样做的：

你必须循环进入你的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

Answer 3

您可以迭代json / js-object并为用户答案设置checked属性：

var answers = JSON.parse(your_json);
for(var i in answers) {
 var answer = answers[i];
 $('ol:eq(+'parseInt(i)+)' input[value="'+answer['M1_Q'+i+'PRE']+'"]').prop('checked', 'checked');
}

如您所见，json格式为此目的提供了优化空间; - ）

哦，实际上答案ID是M1_Q ......对象内部的关键和值 - 需要解决才能使上面的答案工作......然而，一般的想法应该是可见的。

（最好将json更改为更合适的格式。）

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

修改

3 个答案: