Question

HTML：

<div id="hello">
    <span id="world">Hello!</span>
</div>

的jQuery

var $hello = $('#hello'),    // Assigning frequently used
    $world = $('#world');    // selectors to variables.

$hello.children().fadeOut(250, function() {
    $hello.load('other.html #hello > *', function() {
        $world.fadeIn(250);    // This now references nothing...
    });
});

other.html

<div id="hello">
    <span id="world">Something completely different...</span>
</div>

Answer 1

这是因为.load()元素上的#hello调用会在AJAX调用后替换其内容，从而删除原始的#world元素子元素。

新的#world子元素与原始的#world子元素完全不同，因此，在原始jQuery缓存中未被“选中”。您可能需要再次选择，或者（可能更好）只需在.load()元素上调用#world（并更改AJAX响应以满足该更改）。

Answer 2

使用jquery live()或在加载所有html文件后添加jquery文件。

Answer 3

分配$world = $('#world')时，它会引用该特定<div>元素。当您运行.load（）来覆盖<div#world>时，该元素已不再存在，即使它被另一个<div#world>替换

在.load（）之后使用分配给变量的选择器

3 个答案: