I am not able to load an external html page into a div in my page.
My Jquery Code is:
$(document).ready(function(){
var url = 'http://www.google.com';
$.get(url, function(response) {
$('div#external').html(response);
});
});
My HTML page is
<html><body><div id="external"></div></body></html>
I also tried using another JQuery code
$(document).ready(function() {
$('#external').load('http://google.com');
});
Could anyone please help me.
Thanks Amal
Due to browser restrictions, most Ajax requests are subject to the "same origin policy". That means that in most cases, you can’t use jQuerys ajax methods to fetch data from external domains without using a Proxy, YQL, JSONP or equivalent technique to get around this.
A pure javascript option is Yahoo’s YQL service. There is a plugin that extends jQuery.ajax
to allow external domains: https://github.com/padolsey/jQuery-Plugins/blob/master/cross-domain-ajax/jquery.xdomainajax.js
Using this plugin should allow the ajax example in your question.
Another option is to use a server-side proxy and then request that page using ajax. If your server can run PHP, try googling for something like "php ajax proxy" and you’ll get plenty results.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With