send html + JS in ajax

Question

im using jQuery load() method to send another html to my webpage. The html being loaded contains Javascript generated HTML.

Im using this function to load the html:

$(document).ready(function(){
    $("img#links").click(function(){
      $("div#content").load("links.html");
    });
  });

The links.html contains:

<h1 id="content">Links</h1>
<br>
<script>add_link("http://google.com");</script>

The add_link function generates me a table:

var add_link = function(link) {
  document.write("<table border=\"0\" width=\"100%\" height=\"50\" id=\"link\">");
  document.write("<tr>");
  document.write("<td width=\"50\"><img src=\"img/star.png\" /></td>");
  document.write("<td><a href=\"" + link + "\"><div class=\"link\">" + link + "</div></a></td></tr></table>");
}

However, when called instead of writing that js generated code into the webpage, it gets written to a blank page, containing only the table generated by JS.

Consider using javascript templates.

moonwave99
– moonwave99

2012-09-08 20:38:34 +00:00
Commented Sep 8, 2012 at 20:38 — moonwave99
– moonwave99, Commented Sep 8, 2012 at 20:38

Pointy · Accepted Answer · 2012-09-08 20:39:15Z

1

When you call document.write() after the page loading has completed — definitely the case here — the browser will wipe out the original page. In other words, the browser interprets a call after the page is done to be an implicit request to "start over" with a blank page.

Instead of using document.write(), then, you can use DOM APIs to append new content to the page.

answered Sep 8, 2012 at 20:39

Pointy

415k62 gold badges600 silver badges631 bronze badges

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

1 Comment

Ilmari Karonen Over a year ago

Also, if you can't change the code that uses document.write, then you may want to sidestep the problem by overriding the document.write method itself.

Collectives™ on Stack Overflow

send html + JS in ajax

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related