Ajax追加加载

Question

必须使用jQuery

我有一个名为text.html的文件，其中包含6个div（a，b，c，d，e，f）

在另一个文件中，我有一个div，我希望将a + b + c + d + e + f的内容填充到该单个div中

我尝试了.load =但是b替换了a， 我尝试了append，但我需要一个临时变量

所以现在我卡住了

这段代码从文件textes.html获取内容... div #a并将内容放入div #right，但第二行用right b替换了right a的内容

我想附加a + b的内容而不是a覆盖b

$(document).ready(function(){
var temp = load('textes.html #nicolas');
$('#right').append(temp);
var temp = load('textes.html #antoine');
$('#right').append(temp);
.
.
.
.

return false;
});

这段代码的意图是将内容通过ajax的.load()方法加载到变量中，然后将其附加到div中，但我无法实现。

<script type="text/javascript">
$(document).ready(function(){    
$.ajax({
  url: "textes.html",
  cache: false,
  success: function(html){
    $("#right").append(html);
  }
});
});
</script>

这段代码加载整个HTML文件，我只想获取选定的DIV #。

- menardmam

Answer 1

$(document).ready(function(){    
    $.get("textes.html",function(data){
        $("#right").append($("#nicolas",data)).end().append($("#antoine",data));
    },'html');    
});

- Chad Grant

---

如果事实上你有一个简单的方法将.load()内容放入一个变量中，我会将所有内容附加到该变量并在最后将其推入div中！ - menardmam

Marc，.load() 是异步的，所以你不能按照你尝试的方式调用它。我没有测试过那段代码，但这就是正确的方法。.load() 只是 $.get 的包装器，而 $.get 则是 $.ajax 的包装器。http://docs.jquery.com/Ajax - Chad Grant

那段代码会加载整个文件。<script type="text/javascript"> $(document).ready(function(){
$.ajax({ url: "textes.html", cache: false, success: function(html){ $("#right").append(html); } }); }); </script> 如何选择我想从该文件中获取的 div？ - menardmam

Answer 2

我刚刚遇到了类似的问题，但我认为使用.load()函数可以实现我们想要的目标。虽然这不太美观，但没关系 ;)

首先，我在我的html中添加了一个名为"TempDiv"的元素，并设置"visibility:hidden"样式。

<div id="TempDiv" style="visibility:hidden"></div>

然后你运行 jQuery：

$(document).ready(function(){
        $('#TempDiv').load('textes.html #nicolas', function(){
            $('#right').append($('#TempDiv').html());
        });

    });

我不确定这是否是最好的方法!

PS：这是我在stackoverflow上的第一篇帖子;)

- Jibou

Answer 3

尝试一下，

$.get('url.php', function(data) {
    $("#right").append(data);
});

- AmusableLemur

Answer 4

听起来像是使用jQuery吗？请说明您使用的框架，因为我实在看不到任何提及它的内容。无论如何，append应该可以工作。只需执行以下操作：

mydiv.append(a.text());
mydiv.append(b.text());
mydiv.append(c.text());
mydiv.append(d.text());
mydiv.append(e.text());
mydiv.append(f.text());

它们应该全部附加到我的div中。 注意：如果您还想要HTML，请改用“.html()”函数而不是“.text()”。

- Ko9

---

他想要加载数据的 div 在另一个 HTML 文件中，所以这样做行不通。 - Jonathan Parker

Answer 5

JQuery（http://jquery.com/）是一个很好的JavaScript库，您可以使用它来执行AJAX请求以获取其他文件。有关更多信息，请参见此问题：使用jQuery替换XMLHttpRequest。

- Jonathan Parker