DWQA QuestionsCategory: ProgramBig guys, please take a look. Is my Ajax wrong
Vegetables asked 2 months ago
$.ajax({
         url : "data.json",
           method: 'get',
       dataType: "json",
       contentType: "application/json",
    success: function(data){
         //Convert string to array
      for(var i in data){
      //How many data are there in the loop
                $('<div class="cell">'
                    + '<a class="user_avatar pull-left" href="#" target="_blank">'+'<img src="'+data[i].url1+' " />'
                    +'</a>'
                    +'<span class="reply_count pull-left">'
                        +'<span class="count_ of_ Replies "title =" number of replies "> '+ data [i]. Reply +' < / span > '
                        +'<span class="count_seperator">'+"/"+'</span>'
                        +'<span class="count_ of_ Visits "title =" number of visits "> '+ data [i]. Visit +' < / span > '
                    +'</span>'
                    +'<div class="topic_title_wrapper">'
                        +'<span class="'+data[i].kind+ ' ">'+'</span>'
                        +'<a class="topic_title">'+data[i].title+'</a>'
                    +'</div>'
                    +'<a class="last_time pull-right">'
                        +'<img class="user_small_avatar" src="'+data[i].url2+'">'
                        +'<span class="last_ active_ Time "> '+ data [i]. Lasttime +" hours ago "+' < / span >"
                    +'</a>'
                +'</div>'
                ).appendTo($("#content_froum"));
                 
    }
}





{"responseheader": {"status": "0024", "desc": "get forum list successfully"},
  "responseBody":[{
            "url1": "../../../images/common/head/head_01",
            "reply": "22",
            "visit": "200",
            "kind": "put_up",
            "link": "",
            "Title": "it's better to roll a bead curtain on Yangzhou road in the spring breeze.",
            "url2": "../../../images/head/head_21.jpg",
            "Lasttime": "3 hours ago"
        },
        {
            "url1": "../../../images/common/head/head_01",
            "reply": "22",
            "visit": "200",
            "kind": "put_up",
            "Title": "it's better to roll a bead curtain on Yangzhou road in the spring breeze.",
            "url2": "../../../images/head/head_21.jpg",
            "Lasttime": "3 hours ago"
        },
        {
            "url1": "../../../images/common/head/head_01",
            "reply": "22",
            "visit": "200",
            "kind": "put_up",
            "Title": "it's better to roll a bead curtain on Yangzhou road in the spring breeze.",
            "url2": "../../../images/head/head_21.jpg",
            "Lasttime": "3 hours ago"
        },
        {
            "url1": "../../../images/common/head/head_01",
            "reply": "22",
            "visit": "200",
            "kind": "put_up",
            "Title": "it's better to roll a bead curtain on Yangzhou road in the spring breeze.",
            "url2": "../../../images/head/head_21.jpg",
            "Lasttime": "3 hours ago"
        }]
     }

Can output to the page, two are undefined
http://127.0.0.1:8020/self_service_platform/views/documentCenter/forum/undefined 404 (Not Found)
The console reported this error
clipboard.png

3 Answers
A panda mulberry answered 2 months ago

Let’s start with the conclusion: wrong writing. Contenttype is for sending data, and if you just take a JSON, you don’t need to write so much.
On the code (written by mobile phone, so please ignore the format… ):

$.getJSON("data.json", function(data){
    var html = [];
    $.each(data, function(index,item){
        var i = 
            '<div class="cell">'+
               '<a class="user_avatar pull-left" href="#" target="_blank">'+
                     '<img src="'+item.url1+' " />'+
               '</a>'+
               '<span class="reply_count pull-left">'+
                   '<span class="count_ of_ Replies "title =" number of replies ">"+ item.reply +'</span>'+
                   '<span class="count_seperator">'+"/"+'</span>'+
                   '<span class="count_ of_ Visits "title =" visits "> '+ item.visit +'</span>'+
               '</span>'+
               '<div class="topic_title_wrapper">'+
                   '<span class="'+item.kind+ ' ">'+'</span>'+
                   '<a class="topic_title">'+item.title+'</a>'+
               '</div>'+
               '<a class="last_time pull-right">'+
                   '<img class="user_small_avatar" src="'+item.url2+'">'+
                   '<span class="last_ active_ time">'+ item.lastTime +"Hours ago" + '< / span > "+
               '</a>'+
           '</div>';
        html.push(i);
    }
    $("#content_froum").append(html);
});
Vegetables replied 2 months ago

Thank you, because my “ResponseBody” is an array. I’m wrong

dablwow80 answered 2 months ago

Print firstdataSee if the request is successful and correct.
In addition, the correct way to traverse an array isforCycle orforEachmethod,for...inCommonly used to traverse object properties

Vegetables replied 2 months ago

Thank you, because my “ResponseBody” is an array, I traversed wrong, I need body content, data and header

Vegetables answered 2 months ago
$.ajax({
        url: "data.json",
        method: 'get',
        dataType: "json",
    }).done(function(data) {
        console.log(data);
        console.log(data.responseBody);
        let list = data.responseBody;
        for(const item of list) {
            //How many data are there in the loop
            $('<div class="cell">' +
                '<a class="user_avatar pull-left" href=" " target="_blank">' +
                '<img src="' + item.url1 + ' " />' +
                '</a >' +
                '<span class="reply_count pull-left">' +
                '<span class="count_ of_ Replies "title =" number of replies ">"+ item.reply  + '</span>' +
                '<span class="count_seperator">' + ' / ' + '</span>' +
                '<span class="count_ of_ Visits "title =" visits "> '+ item.visit  + '</span>' +
                '</span>' +
                '<div class="topic_title_wrapper">' +
                '<span class="' + item.kind + ' ">' + '</span>' +
                '<a class="topic_title">' + item.title + '</a >' +
                '</div>' +
                '<a class="last_time pull-right">' +
                '<img class="user_small_avatar" src="' + item.url2 + '">' +
                '<span class="last_ active_ time">' +  item.lastTime  +"Hours ago" + '< / span > "+
                '</a >' +
                '</div>'
            ).appendTo($("#content_froum"));

        }
    }).fail(function(e) {
        console.log(e);
    });

This is my successful code call, thank you very much