How to load the url in html div tag using javascript or jquery

Question

Here the below i have wriiten for load the webpage inside of div tag via 'url' i've enclosed. but it not working. can anyone know. pls help.

<html>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<a href="#" onClick="lurl();">Click Here</a>
<br/>
<br/>
<br/><div id="durl">
</div>
<script type="text/javascript">
function lurl(){
$('#durl').load('http://www.tndte.com/Result/');
}
</script>
</html>

ya its a proper url only.. if i using iframe it return the proper output, but iframe restrict something to access. but above pgm return nothing. i cant find the error also. — Hari, Mar 15 '13 at 07:49
If it's an external web site there's no going around the access restrictions using JavaScript only. — JJJ, Mar 15 '13 at 07:50
you would need to create a proxy that would run server side. — Amrendra, Mar 15 '13 at 07:52

score 1 · Answer 1 · answered Mar 15 '13 at 07:51

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. Browser restricts, most Ajax requests are subject to the "same origin policy".

You can use the https://github.com/padolsey/jQuery-Plugins/blob/master/cross-domain-ajax/jquery.xdomainajax.js and include the js file in your page. Below is the function that I used to load the external page.

function test () {
         $.ajax({
           url: 'http://www.tndte.com/Result/',
           type: 'GET',
           success: function(res) {
             var content = $(res.responseText).text();
             alert(content);
           }
         });
       }

@user1709672 have you included the xdomainajax.js? – Talha Mar 15 '13 at 09:11 — Talha, Mar 15 '13 at 09:11

score 1 · Answer 2 · answered Mar 15 '13 at 07:52

Thats correct, ajax calls cannot retrieve external pages for security reasons.

The only way to get external pages onto your page is to use an iframe, or a simple server side proxy that you can call with your ajax.

We can not do that unless the content are coming from the same domain , and reason javaScript's Same Origin Policy.

You can still do it as

use iframe load the content
use server-side script

score 0 · Answer 3 · answered Mar 15 '13 at 07:48

0

Unless you are accessing files on the same server as your page is, this will not work. You need to use an iframe if you're trying to embed external content.

http://www.w3.org/TR/html4/present/frames.html

answered Mar 15 '13 at 07:48

Edgar Allan Pwn

311
1
8

Or you could use PHP's `include()` or `file_get_contents()` – Adrenaxus Mar 15 '13 at 07:51

score 0 · Answer 4 · answered Mar 15 '13 at 08:02

0

Before trying out the answers..You have to add http: in your src path.

answered Mar 15 '13 at 08:02

Samy

632
4
14

It's not necessary. See http://stackoverflow.com/questions/4071117/uri-starting-with-two-slashes-how-do-they-behave – JJJ Mar 15 '13 at 08:43
@Juhana Good catch. I have tried with this syntax its throwing error - ReferenceError: $ is not defined – Samy Mar 15 '13 at 08:48

How to load the url in html div tag using javascript or jquery

4 Answers4