Jquery 。附加一个新的div,其中包含图片

Jquery 。附加一个新的div,其中包含图片,jquery,ajax,flask,append,Jquery,Ajax,Flask,Append,我正在使用AJAX编写一个Flask应用程序。用户进行查询,每次答案出现在新的div中时;例如,他要一个地方,应用程序会显示该地方的两张图片和一篇维基百科文章。 问题是,每次用户进行查询时,前一个div中也会显示这两张图片,只有最后一个div显示为其中的两张图片 $("#chatbox").append( "<p class = display_question>"+data['user_question']+"</p>" );

我正在使用AJAX编写一个Flask应用程序。用户进行查询,每次答案出现在新的div中时;例如,他要一个地方,应用程序会显示该地方的两张图片和一篇维基百科文章。 问题是,每次用户进行查询时,前一个div中也会显示这两张图片,只有最后一个div显示为其中的两张图片

    $("#chatbox").append( "<p class = display_question>"+data['user_question']+"</p>" );                            
    $("#user_form")[0].reset();
    $("#chatbox").append("<div class = pictures> </div>");       
    $(".pictures").append($('<img id = wiki_img>').attr('src', data['wiki_pic']));
    $(".pictures").append($('<img id = img>').attr('src', data['response']));        
    $("#chatbox").append( "<p class = wikidata>"+data['wiki_data']+"</p>" ); 
$(“#聊天室”).append(“

”+数据['user_question']+”

”; $(“#用户表单”)[0]。重置(); $(“#聊天室”)。附加(“”); $(“.pictures”).append($(''.attr('src',data['response']); $(“#聊天室”).append(“

”+data['wiki_data']+”

”);

有没有一种方法可以在不将两张图片添加到上一张图片的情况下将两张图片附加到div中?

您需要选择正确的元素(仅最后一张
div.pictures
);在选择所有
div.pictures
之前;看

$(“#聊天室”).append(“

”+数据['user_question']+”

”; $(“#用户表单”)[0]。重置(); $(“#聊天室”)。附加(“”); //将图片附加到类的最后一个元素。仅图片 $(“.pictures”).last().append($('').attr('src',data['response']); $(“#聊天室”).append(“

”+data['wiki_data']+”

”);
$("#chatbox").append( "<p class = display_question>"+data['user_question']+"</p>" );                            
$("#user_form")[0].reset();
$("#chatbox").append("<div class = pictures> </div>");       

// Append pictures to last element of class .pictures only
$(".pictures").last().append($('<img id = wiki_img>').attr('src', data['wiki_pic']));
$(".pictures").last().append($('<img id = img>').attr('src', data['response']));        

$("#chatbox").append( "<p class = wikidata>"+data['wiki_data']+"</p>" );