I am trying to make a website that loads all pages using AJAX
. Here’s a simple piece of JS
that does that:
$.ajax({
url: url,
type: 'GET',
success: function(html) {
document.open();
document.write(html);
document.close();
}
});
This obviously works and updates my current page content.
The problem is I want to keep one div
unchanged (let’s call it .player-wrapper
). This div
is actually an <audio>
wrapper which I want to keep playing (and this is the reason I AJAXified the entire website). Is this possible?
3
Answers
If you want to keep the audio tag with the player-wrapper class let’s take this html as our base:
Then with the following code you can place the html you received from the ajax request:
Just don’t write the html to the document, but place it in an already existing element like the div with the page-content class in this example.
And when you need to execute script tags in the html you can use jQuery’s append method (since you are already using jQuery)
One thing you can do is copy the .player-wrapper before you write.
Every time you render a page, you can initialize plugins/libraries like this: