На веб-сайте, над которым я работаю, содержимое загружается с помощью Ajax вместе с любым включенным JavaScript. Я делаю это, потому что все страницы имеют один и тот же макет, но только контент отличается.
Проблема в том, что в «контенте» есть JavaScript, я боялся, что скрипт будет продолжать выполняться даже после загрузки нового контента. Поэтому я сделал это испытание, чтобы убедиться.
Сначала главная страница, на которой будут загружены две другие страницы:
<script src="scripts/jquery.min.js"></script> <script> function loadPage1(){ var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (xhttp.readyState == 4 && xhttp.status == 200) { response = xhttp.responseText; $("#content").remove(); $("#mainContent").append(response); } }; xhttp.open("GET", "page1.html", true); xhttp.send(); } function loadPage2(){ var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (xhttp.readyState == 4 && xhttp.status == 200) { response = xhttp.responseText; $("#content").remove(); $("#mainContent").append(response); } }; xhttp.open("GET", "page2.html", true); xhttp.send(); } </script> <button onclick="loadPage1()">Load page 1</button> <button onclick="loadPage2()">Load page 2</button> <div id="mainContent"> </div> А затем 2 страницы с содержимым JavaScript, в основном просто рассылая консоль с помощью «Я страница x» каждую секунду.
Страница 1:
<div id="content"> <h1>Page 1</h1> <script type="text/javascript"> setInterval(function(){ console.log("I am page 1"); },1000); </script> </div>
Страница 2:
<div id="content"> <h1>Page 2</h1> <script type="text/javascript"> setInterval(function(){ console.log("I am page 2"); },1000); </script> </div>
Ajax загружается отлично, я вижу, что h1 меняется со Page 1 на Page 2 . Но в консоли я вижу, что первый скрипт по-прежнему рассылается спам даже после удаления содержимого.
Есть ли способ предотвратить такое поведение? Предпочтительно, сохраняя каждый сценарий в нужном месте, а не перемещая все сценарии на «главную страницу».
EDIT : Чтобы избежать путаницы, setInterval() не является основной проблемой, это всего лишь пример. Я спрашиваю, как обычно вы сталкиваетесь с такой проблемой с Ajax и JavaScript?