无法将带有jQuery.load的外部页面加载到我的页面中的div中
我无法将外部html页面加载到页面中的div中。
我的Jquery代码是:
$(document).ready(function(){ var url = 'http://www.google.com'; $.get(url, function(response) { $('div#external').html(response); }); });
我的HTML页面是
我也尝试过使用另一个JQuery代码
$(document).ready(function() { $('#external').load('http://google.com'); });
有谁可以帮助我。
谢谢Amal
由于浏览器的限制,大多数Ajax请求都受“同源策略”的约束。 这意味着在大多数情况下,您无法使用jQuerys ajax方法从外部域获取数据,而无需使用Proxy,YQL,JSONP或等效技术来解决此问题。
纯javascript选项是Yahoo的YQL服务。 有一个扩展jQuery.ajax
的插件允许外部域: https : //github.com/padolsey/jQuery-Plugins/blob/master/cross-domain-ajax/jquery.xdomainajax.js
使用此插件应该允许您的问题中的ajax示例。
另一种选择是使用服务器端代理,然后使用ajax请求该页面。 如果您的服务器可以运行PHP,请尝试使用Google搜索“php ajax proxy”之类的内容,您将获得大量结果。
首先下载JS文件https://github.com/padolsey/jQuery-Plugins/blob/master/cross-domain-ajax/jquery.xdomainajax.js并在页面中包含js文件。 下面是我用来加载外部页面的function。
function test () { $.ajax({ url: 'http://external_site.com', type: 'GET', success: function(res) { var content = $(res.responseText).text(); alert(content); } }); }
这对我来说是从外部网站获取内容的。
$('div#external').html();
将div
对象中的HTML设置为空字符串。
由于response
是返回的HTML,您可能意味着:
$(document).ready(function(){ var url = 'http://www.google.com'; $.get(url, function(response) { $('div#external').html(response); }); });
$.get
上的jQuery 文档提供了这样的示例。
您的下一个问题是您正在尝试发出跨域请求。 有关如何在此区域中解决Javascript安全限制的详细信息,请参阅此站点 。
由于原始政策相同,您只能在域外发送请求。 JSONP是一个解决方案,可能会有所帮助。
为了绕过跨域限制,请尝试使用jQuery.getJSON(使用JSONP)。
jQuery.getJSON(url, function(data){ // your code here $('div#external').html(data); });
PS:但你的url变量应该包含这样的回调函数:“http://www.example.com/?t=”+v + “& callback =? ”