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

【问题标题】：how to load html from server and use jquery selectors如何从服务器加载 html 并使用 jquery 选择器
【发布时间】：2013-10-21 13:05:52
【问题描述】：

我在 .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
});

知道我哪里出错了吗？

【问题讨论】：

【解决方案1】：

您必须等到 div 加载完毕，您可以使用来自.load 的回调：

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

【讨论】：

【解决方案2】：

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

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

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

【讨论】：

【解决方案3】：

您可以使用加载方法Callback Function 来执行此操作，例如：

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

【讨论】：

【解决方案4】：

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

【讨论】：