JQuery 将页面内容加载到 Div答案

【问题标题】：JQuery Load Page Content into DivJQuery 将页面内容加载到 Div
【发布时间】：2011-07-12 20:01:00
【问题描述】：

我发现了很多关于如何将页面内容加载到 div 的问题/答案；但是，我无法加载。我正在 document.ready 中运行 jquery。单独运行警报可以正常工作，但下面的代码不能。任何指针将不胜感激。谢谢！

//First I tried this:
$("#divTestPreview").load("~/Testing/TestCreation/AddTestItems.aspx");
//and then I tried this:
$.get('~/Testing/TestCreation/AddTestItems.aspx', function (data) {
            $('#divTestPreview').html(data);
            alert('Load was performed.');
});

<div id="divTestPreview" runat="server" style="width: 100%; height: 500px;">
</div>

【问题讨论】：

看这个：stackoverflow.com/questions/1050996/jquery-cross-site-fetch
谢谢！抱歉，我对谷歌的测试不是一个好的测试，因为我试图在我自己的网站中加载一个页面。上面编辑过的代码。

标签： jquery html load

【解决方案1】：

尝试删除 div 中的 runat="server"，因为我认为您的 ASP.NET 解释器可能会在 HTML 到达客户端之前对其进行处理。

谢谢！

【讨论】：

视情况而定。如果您已将 ClientIDMode 设置为静态，它不会与 id 混淆。但就像我说的，这取决于模式，当然它是在 .NET4 上运行的。顺便说一句:)
@Gauthic 是正确的 asp.net 将在页面呈现时生成一个 id。如果您需要保留 runat="server" 然后使用 $("#" + +").load(...
渲染后的代码如下：$.get('http://www.google.com', function (data) { $("#" + "ctl00_mainContent_divTestPreview").html(data); alert('Load was performed.'); });

【解决方案2】：

您的 div 具有 runat="server" 标记，使其成为服务器端控件。要在客户端访问它，您需要使用 ClientID 来访问 div。像这样

$("#<% divTestPreview.ClientID %>").load();

【讨论】：

应该是“#”
我试过了，还是不行：$("#" + "ctl00_mainContent_divTestPreview").load("http://www.google.com");（渲染代码）
这是因为您正在尝试加载一些不在您的域中的页面（即 google.com）。对于跨域请求，请参考上面 kleinohad 提供的链接
试试 $("#").load("/Testing/TestCreation/AddTestItems.aspx");
这让我更进一步，但我在动态生成的页面上遇到错误。我想我将以不同的方式加载内容。感谢您的帮助！

【解决方案3】：

您可以使用 load 并仅加载域内的页面，否则您将收到跨域错误有一个解决方案，您需要创建某种代理阅读此：WebBrowser Control: Disable Cross Site XSS Filtering or another way to process JS in full on HTML 或者您可以试试这个： http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/

【讨论】：

load & get 可以从任何地方加载页面.. get & load 通常用于从同一域加载页面...但这并不意味着它们不能用于加载来自不同网站的内容。
这意味着您不能从其他域加载数据，除非在服务器端（作为代理）这样做并在 javascript 上使用相同的域（服务器）
谢谢！我实际上是在尝试访问本地页面：$("#" + "ctl00_mainContent_divTestPreview").load("~/Testing/TestCreation/AddTestItems.aspx");（渲染代码）

【解决方案4】：

Access-Control-Allow-Origin 不允许，您正在制作跨域AJAX，在当前版本的浏览器中是不可能的，您必须在服务器端执行此操作，例如在 PHP 中 fopen() o file_get_contents()，如果你需要在客户端进行，对于现代浏览器，有许多选项，例如 flensed FLXHR 或 CORS。

【讨论】：