jquery - 如何从服务器加载 html 并使用 jquery 选择器

Question

我在 .aspx 页面上有一个 div：

<div id="container"></div>

我正在使用 jQuery .load() 方法从服务器加载一些 html，如下所示：

$(function() {
    $('#container').load('web/testpage');
});

其中 web/testpage 是 mvc 部分视图：

<div id='partialView'>
   blah blah
</div>

这加载正确，我在萤火虫中看到了预期的标记

<div id="container">
   <div id='partialView'>
      blah blah
   </div>
</div>

但问题是我无法从 jQuery 中选择内部 div

$(function() {
   console.log($('#partialView')); // this is empty
});

知道我哪里出错了吗？

score 1 · Accepted Answer

你必须等到 div 被加载，你可以使用回调.load：

$('#container').load('web/testpage', function() {
    console.log($('#partialView'));
});

score 1 · Accepted Answer

您不能在 DOMReady 上进行选择，因为在函数完成#partialView之前它还没有加载到页面中。load()

如果您需要对此元素执行逻辑，则需要使用回调参数load()：

$(function() {
    $('#container').load('web/testpage', function() {
        console.log($('#partialView')); // "[Object object]"
    });
});

score 1 · Accepted Answer

您可以使用加载方法回调函数来执行此操作，例如：

$(function () {
    $('#container').load('web/testpage', function (response) {
        console.log($('#partialView'));
    });
});

score 0 · Accepted Answer

您的代码是正确的，但我认为您的“console.log(....)”函数是在加载部分视图之前调用的。所以你什么也得不到。

4 回答 4