How to stop javascript ajax requests in inactive Iframe?

Question

I have made Website, where various other pages are built-in as "apps" with i frames:

<iframe id="frame1" src="./app1.php">
<iframe id="frame2" src="./app2.php">

In these apps, there is javascript code executed, among others very high-frequent HTTP-Requests.

$('#app1button').click(function () {
     //Here i have to stop the HTTP-Requests which where fired from the JS of App2
     hideAllApps();
     showApp(app1);
});

app1 is polling information from a server very high frequently:

app1.php has Javascript in it::

 Handler = window.setInterval(getStatus, 100); //start status messages

When i now click on app2, the other app pops up, and i want to stop the javascript, which was loaded in app1.php, due to performance reasons.

$('#app2button').click(function () {
    //Here i have to stop the HTTP-Requests which where fired from the JS of App1
    hideAllApps();
    showApp(app2);
});

How can i do that? Do you have any ideas?

Thanks in advance.

Answer 1

From within frame2 you can try window.parent.frame["frame1"].stop() and in frame 1 you define stop() as a function which clears your interval.

Answer 2

Since all iframes have there own window.You can use window.onfocus. window.onblur. put code inside each iframe. jsfiddle

var Handler ;
window.onfocus = function(){
         Handler = window.setInterval(getStatus, 100); //start status messages

}
window.onblur = function(){

  clearInterval(Handler );
}