Load html from external file without losing the <script> tags?

Question

I want to download some html from an external source, and get only the contents within id #lay_body_get. This external source also contains a <script></script> tag but jQuery is taking out off from the response. Is there any way to get the html code including the javascript code inside the script tags ?

this is the function :

function ocmenu(url) {       
    $.ajax({
        url: url,
        dataType:"text"
     }).done(function(resp) {
          $('.new').html($('#lay_body_get',resp));
     });
}

Luggage · Accepted Answer · 2013-08-15 01:17:33Z

7

Don't use dataType:"text". Use "html" or leave it on auto.

See: jQuery .ajax docs

"html": Returns HTML as plain text; included script tags are evaluated when inserted in the DOM. "text": A plain text string.

Further down on the same page:

If html is specified, any embedded JavaScript inside the retrieved data is executed before the HTML is returned as a string.

Some other potential causes:

The mimeType returned by the server isn't text/html

A simple working example

file1.html

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
    <div id="putResultHere">
    </div>

    <script>
        $(function() {
           $.ajax({
                url: 'file2.html',
                dataType:"html"
             }).done(function(resp) {
                  $('#putResultHere').html($(resp));
             });

        });
    </script>
</body>
</html>

file2.html

<h1>Ajax done!</h1>

<script>
alert('script worked');
</script>

edited Aug 15, 2013 at 1:17

answered Aug 15, 2013 at 0:44

Luggage

1,8961 gold badge20 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user2680229 Over a year ago

It did not help. May be it help: If I use $('.new').html(resp); scripts dont copy, but they work on page.

user2680229 Over a year ago

Yes, its work, but I need clear code from header and footer and display only body

Luggage Over a year ago

In that case, my answer is wrong. I accidentally left in dataType: "text" and it still works.

kpollock Over a year ago

actually, you still get the script inside the div tags - which is an issue for me because my "script" is html (an angular template) and it doesn't work inside the div

Ohgodwhy · Accepted Answer · 2013-08-15 00:40:13Z

0

$(resp).find('script').each(function(i,script){
    eval($(script).text());
});

Make sure you trust the external file..

answered Aug 15, 2013 at 0:40

Ohgodwhy

50.8k11 gold badges86 silver badges114 bronze badges

Collectives™ on Stack Overflow

Load html from external file without losing the <script> tags?

2 Answers 2

Some other potential causes:

A simple working example

file1.html

file2.html

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Some other potential causes:

A simple working example

file1.html

file2.html

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related