Question

这是从我的PHP

返回的JSON

{
"17":{"answer_id":"17","answer":"You earn a salary","is_correct":"N"},
"18":{"answer_id":"18","answer":"You earn profit","is_correct":"N"},
"19":{"answer_id":"19","answer":"You invest money","is_correct":"N"},
"20":{"answer_id":"20","answer":"All of the above.","is_correct":"Y"}
}

所以我基本上需要遍历这个并将它们显示为单选按钮选项。但我被困 - 我检查了这个解决方案 jQuery $.each loop and json data

但这只是一个数组，而我的另一个问题是密钥是一个数字。

任何帮助将不胜感激

由于

Answer 1

var data = {
    "17": {
        "answer_id": "17",
        "answer": "You earn a salary",
        "is_correct": "N"
    },
    "18": {
        "answer_id": "18",
        "answer": "You earn profit",
        "is_correct": "N"
    },
    "19": {
        "answer_id": "19",
        "answer": "You invest money",
        "is_correct": "N"
    },
    "20": {
        "answer_id": "20",
        "answer": "All of the above.",
        "is_correct": "Y"
    }
}

$.each(data, function(key, value) {
    $('#content').append('<input id="rad-'+key+'" type="radio" name="contnet" value="'+key+'"><label for="rad-'+key+'">'+value.answer+'</label><br>');
});

DEMO

Answer 2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var data = {
                "17": { "answer_id": "17", "answer": "You earn a salary", "is_correct": "N" },
                "18": { "answer_id": "18", "answer": "You earn profit", "is_correct": "N" },
                "19": { "answer_id": "19", "answer": "You invest money", "is_correct": "N" },
                "20": { "answer_id": "20", "answer": "All of the above.", "is_correct": "Y" }
            };

            $.each(data, function (i, entity) {
                $('#radioButtonList').append($('<input />', { 'type': 'radio', 'name': 'answerRadioButtonList', 'id': entity.answer_id, 'value': entity.is_correct })).append(entity.answer + '<br />');
            });

            $('#radioButtonList').find(':radio').live('click', function () {
                if ($(this).val() === 'Y') {
                    alert('Correct Answre.');
                }
            });
        });
    </script>
</head>
<body>
    <div id="radioButtonList">
    </div>
</body>
</html>

Answer 3

var ret = {
"17":{"answer_id":"17","answer":"You earn a salary","is_correct":"N"},
"18":{"answer_id":"18","answer":"You earn profit","is_correct":"N"},
"19":{"answer_id":"19","answer":"You invest money","is_correct":"N"},
"20":{"answer_id":"20","answer":"All of the above.","is_correct":"Y"}
};

$.each(ret, function(key, value) {

   var radio_with_label = $('<label for="'+ value.answer_id +'">'+ value.answer +'</label><input name="'+ key +'" id="'+ value.answer_id +'" type="radio" value="'+ value.is_correct+'">');

   $(TARGET).append(radio_with_label); // TARGET -> any valid selector container to radios
});

如何使用Jquery显示包含数组的JSON数据

3 个答案: