如何将ajax html响应附加到当前div旁边

我的DOM如下，

 
 
 
Mike
 
John
 
Ket
 
  

和jQuery如下，

 $(document).on('click','div[id^=[level] ul li span a',function(){ //Making ajax request,no problem in getting the response // Here I need to append response next to the current div i,e div#level-1 or div#leve-2 }); 

ajax响应将与上面的DOM相同，除了div id和anchor tag内容。 id将是level-2或level-3 i，e。 +1到div的当前值。

Answer 1

尝试

 $(document).on('click','div[id^=level] ul li span a',function(){ var parentDiv = $(this).closest("div[id^=level]"); $.ajax(...).done(function(html) { parentDiv.after(html); }); }); 

Answer 2

你能加这样的父div吗？

 
 
 
 
Mike
 
John
 
Ket
 
 
  

你可以在jquery中做到这一点

 $("a").on("click",function(){ // on ajax success $(this).parent("#levels").append("whatever you want!"); }); 

Answer 3

对于ajax响应，您可以将附加函数添加到请求的响应中，例如:(伪代码）

 $.ajax({ url: "test.html", context: document.body }).done(function() { //add response functionality here eg if(var i; i < response.length; i++) { $('#level-'+(i+1)).append('
'); } }); 

如果从具有多行的ajax请求中获取数组 – 您可以遍历每一行并使用.append（）jquery函数将新的html追加到当前div。

http://api.jquery.com/append/

Answer 4

您的选择器内部有一些语法错误，并尝试在success回调中将response附加到您的div：

 $(document).on('click','div[id^="level"] ul li span a',function(){ var $this = $(this); $.ajax({ ........... success: function(response){ $this.closest('div[id^=level]').append(response) }, }); }); 

Answer 5

 $('.submit').click(function() { var html=''; $.ajax({ dataType: "json", url: "http://www.yoururl.com/", success: function (data) { var content = 'Title : '+data.Title ; content += ' Year : '+data.Year ; content += ' Rated : '+data.Rated ; content += ' Released : '+data.Released ; $("#text").append(content); } }); });