stop auto refresh when clicked on a div

Question

i would Like to stop auto refresh when i click on a specfic div this is how my code looks like at the moment

jquery.js

var documentInterval;
$(document).ready(function(){
  documentInterval setInterval(function(){
      $('#show_here').load('fetch_something.php')
  }, 3000);
});

$('#stop_auto_refresh').click(function(){
  clearInterval(documentInterval);
});

index.php

<div id="show_here"></div>
<div id="stop_auto_refresh" onclick="documentInterval()">Click To Stop Auto Refresh</div>

I would like to stop auto refresh when click on the id stop_auto_refresh is this possible ?

Possible duplicate of [Stop setInterval call in JavaScript](http://stackoverflow.com/questions/109086/stop-setinterval-call-in-javascript) — Madhawa Priyashantha, May 09 '16 at 02:09
I thought the same, but... OP also asked how to set a click handler...? — Dan, May 09 '16 at 02:11
no search research.you can find lot of answers,tutorials about adding click handler. — Madhawa Priyashantha, May 09 '16 at 02:13

Dan · Answer 1 · 2016-05-09T04:29:53.123

1

Intervals are cleared as using the clearInterval(intervalReference). You can add a click handler using the .click() jQuery api since you are using jQuery.

var documentInterval;

$(document).ready(function() {
   documentInterval = setInterval(function(){
      $('#show_here').load('fetch_something.php')
   }, 3000);

   $('#stop_auto_refresh').click(function(){
     clearInterval(documentInterval) 
   })

});

edited May 09 '16 at 04:29

answered May 09 '16 at 02:10

Dan

2,830
19
37

its not working do i need to call it in my button in the div `stop_auto_refresh` – James May 09 '16 at 03:22
i did add the '#' but it still isnt working any fixes – James May 09 '16 at 03:53
@RokoC.Buljan thank you for your constructive, gentle handed approach on this, much appreciated. I've updated the post, and here is a [working plunker example](https://plnkr.co/edit/HlIKVO2elRsWBAaYnjkk?p=preview). – Dan May 09 '16 at 04:29
@Dan looks much better now – Roko C. Buljan May 09 '16 at 04:33

score 0 · Answer 2 · answered May 09 '16 at 02:12

0

You need to set your interval function as a var and then you can use an onclick event to fire another function that contains clearInterval(varObject);

answered May 09 '16 at 02:12

martinB0103

245
1
6

Look at the example at [W3 Schools](http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_win_setinterval_clearinterval) – martinB0103 May 09 '16 at 03:59

stop auto refresh when clicked on a div

2 Answers2

Linked