将附加到已经存在的 HTML 上的 Jquery 加载函数答案

【问题标题】：Jquery load function that will append onto HTML already present将附加到已经存在的 HTML 上的 Jquery 加载函数
【发布时间】：2011-09-15 02:29:10
【问题描述】：

我正在尝试进行 AJAX 调用，该调用将附加 html，即在标签之间已经存在的内容中添加额外的 html。这是我的加载函数的样子。

<script>
    $(document).ready(function(){
      $(".tid-select").change(function(){
        $(".tid-list").load("/saffron_main/test");
      });
    });
</script>

我将如何修改此函数以使其附加到类 .tid-list。提前致谢。

【问题讨论】：

什么意思？你想追加而不是替换吗？
没错，我想追加而不是替换
你不能使用 load() 然后我认为 - 你必须做一个正常的 .ajax() 调用 api.jquery.com/category/ajax 然后附加成功回调

标签： javascript jquery html ajax

【解决方案1】：

你必须通过ajax获取数据并使用$('.tid-list').append(data);

<script>
$(document).ready(function(){
  $(".tid-select").change(function(){
   $.get("/saffron_main/test",function(data){
    $('.tid-list').append(data);
   });
 });
});
</script>

您也可以使用$('.tid-list').prepend(data); 在当前 HTML 之前插入。

【讨论】：

【解决方案2】：

或者，您可以将数据加载到变量中，然后将其添加到 DOM，而不是替换 html。

例子：

$.ajax({
    url: '/saffron_main/test',
    success: function (data) {
        $('.tid-list').append(data);
    }
});

这样，已绑定到现有 html 的事件将保持绑定。

【讨论】：

【解决方案3】：

只需更改更改处理程序

$(".tid-select").change(function(){
   $.get("/saffron_main/test", function(data){
      $(".tid-list").append(data);
   });
});

编辑：是的，其他人说得对，追加更有意义

【讨论】：