将Json值解析为html标记

时间:2015-07-12 16:40:01

标签: javascript jquery ajax html5 jquery-mobile

如何解析k和v的每个标记到html标记。

USERNAME_FIELD

json如下:

['email','username']

k的值返回标记名称,但是如何将每个标记元素解析为html标记。

var json = $.parseJSON(data);
var x = 0;
$(json).each(function(i, val) {
    $.each(val, function(k, v) {

        var my_href = "#";
        var img_source = "..img";
        var my_title = "...abcd";
        var slider_index = "wows_" + x;

        x++; //increment link id

        $('#ws_images').html('<li><a href="' + my_href + '"><img src="' + img_source + '" alt="" title="' + my_title + '" id="' + slider_index + '" /></a></li>');

    });
});

1 个答案:

答案 0 :(得分:0)

尝试使用单$.each(),将.append()替换为html()

&#13;
&#13;
var data = [{
  "news_id": "8",
  "title": "ddd",
  "description": "ddd",
  "photo": "News_images\/20020_1116863714996046_8844424307040103167_n.jpg",
  "posted_on": "2015-07-12 12:54:48",
  "news_type": "image_slider",
  "dept_id": "1"
}];

  $.each(data, function(k, v) {

    $("#ws_images")
    .append("<li><a href=#>"
            + "<img src=" + v. photo 
            + " alt=''" 
            + " title=" + v.title
            + " id=wows_" + k + " />"
            + "</a></li>");

  });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<ul id="ws_images"></ul>
&#13;
&#13;
&#13;