JQuery Ajax 帮助

Question

我的网站上有一个页面当前通过 ajax 加载 html。 JQuery 是：

$(document).ready(function() {
$('.projects a').click(function(event) {
    $('#work').load(this.href);
    event.preventDefault();
});

});

html 是：

<div class="projects">
    <a href="work/link.html" title="blah" id="blah">blah</a>

    <a href="work/link1.html" title="blah" id="blah">blah</a>

    <a href="work/link2.html" title="blah" id="blah">blah</a>
</div>

这工作正常，但我的要求发生了变化，我想将正在加载的页面的某个区域拉到#work div中。所以我想说，当单击 .project a 时，会将 #this div 的内容从 this.href 加载到 #work 中。有人能指出我正确的方向吗？

Answer 1

查看加载页面片段部分。您可以通过向 url 字符串添加选择器来定位要加载的页面部分。

.load() 方法，与 $.get() 不同， 允许我们指定一部分 要插入的远程文档。这 是通过特殊语法实现的 网址参数。如果有一个或多个 空格字符包含在 字符串，字符串的一部分 假设第一个空格后面 成为一个 jQuery 选择器 确定要加载的内容。

$('#result').load('ajax/test.html #container');

当该方法执行时， 检索内容 ajax/test.html，然后 jQuery 解析 返回的文档查找 具有容器 ID 的元素。这 元素及其内容是 插入到具有 ID 的元素中 结果，以及其余的 检索到的文档将被丢弃。

$('#work').load(this.href + ' #this');

Answer 2

$(document).ready(function() {
    $('.projects a').click(function (event) {
        jQuery.get(this.href, function (response) {
            $('#work').empty().append($(response).find('#myDiv'));
        });
    });

    event.preventDefault();
});