jquery laden Funktion ersetzt nicht zuvor geladene Seite

Question

Ich versuche, verschiedene Seiten in div zu laden, wenn Benutzer auf Links klickt.

Hier ist meine index.html Code:

function loadContent(elementSelector, sourceUrl) { 
$(""+elementSelector+"").empty(); 
$(""+elementSelector+"").load("http://localhost:7070/ning/"+sourceUrl+""); 
} 

Mein cardinal.jsp sieht wie folgt aus:

$(document).ready(function() { 
    setInterval(function(){ 
    alert("Cardinal"); 
},5000); 
}); 

Und PayPoint

<li><a href="javascript:loadContent('#content_main','cardinal.jsp')">SMS</a></li> 
<li><a href="javascript:loadContent('#content_main','paypoint.jsp')">Paypoint</a></li> 

Und Loadcontent-Funktion sieht wie folgt aus .jsp hat folgenden Code:

$(document).ready(function() { 
    setInterval(function(){ 
    alert("paypoint"); 
},5000); 
}); 

Ich klicke zuerst auf den Link SMS. Dies lädt die cardinal.jsp und zeigt die Warnmeldung (Kardinal) alle 5 Sekunden an. Jetzt, wenn ich auf den Paypoint-Link klicke, sollte ich nur die paypoint.jsp-Seite aufrufen. Stattdessen scheint es, als ob es die paypoint.jsp-Inhalte an div anhängen würde (die bereits den Inhalt von cardinal.jsp enthält). Dies führt dazu, dass beide Warnmeldungen abwechselnd angezeigt werden.

Wie Sie sehen können, habe ich versucht, den Inhalt von Div vor dem Laden der neuen Seite zu leeren. Aber es funktioniert immer noch nicht. Was mache ich hier falsch?

Vielen Dank für die Hilfe im Voraus

Answer 1

Interval nicht verschwindet, wenn Sie den Code entfernen, die sie einstellen. Wenn Sie es etwas entfernen möchten wie:

var interval = setInterval(function() { 
    alert("paypoint"); 
}, 5000); 

clearInterval(interval); 

Denken Sie daran, dass Sie nicht eine völlig neue Seite aber neue Inhalte vorhandene Seite zu laden.

Answer 2

Ja, wie Heikki vorgeschlagen .... das für mich gearbeitet .....

In index.html

<script> 
    var interval; 
function loadContent(elementSelector, sourceUrl) { 
    $(elementSelector).empty(); 
    interval = window.clearInterval(interval); 
    $(elementSelector).load("http://localhost/"+sourceUrl+""); 
} 
</script> 

und in paypoint.jsp

$(document).ready(function() { 
    interval = window.setInterval(function(){ 
    alert("Paypoint"); 
    },5000); 
}); 

und in cardinal.jsp

$(document).ready(function() { 
    interval = window.setInterval(function(){ 
    alert("Cardinal"); 
    },5000); 
}); 

c hey, wenn das auch für dich funktioniert ....