Bagaimana cara menghapus setInterval ini di dalam suatu fungsi?

Biasanya, saya mengatur interval ke variabel dan kemudian menghapusnya var the_int = setInterval(); clearInterval(the_int);tetapi untuk kode saya berfungsi, saya meletakkannya dalam fungsi anonim:

function intervalTrigger() {
  setInterval(function() {
    if (timedCount >= markers.length) {
      timedCount = 0;
    }

    google.maps.event.trigger(markers[timedCount], "click");
    timedCount++;
  }, 5000);
};

intervalTrigger();

Bagaimana saya menghapus ini? Saya mencobanya dan berusaha var test = intervalTrigger(); clearInterval(test);memastikan, tetapi itu tidak berhasil.

Pada dasarnya, saya perlu ini berhenti memicu setelah Google Map saya diklik, mis

google.maps.event.addListener(map, "click", function() {
  //stop timer
});

The setIntervalmethod mengembalikan pegangan yang dapat Anda gunakan untuk membersihkan interval. Jika Anda ingin fungsi mengembalikannya, Anda cukup mengembalikan hasil pemanggilan metode:

function intervalTrigger() {
  return window.setInterval( function() {
    if (timedCount >= markers.length) {
       timedCount = 0;
    }
    google.maps.event.trigger(markers[timedCount], "click");
    timedCount++;
  }, 5000 );
};
var id = intervalTrigger();

Kemudian untuk menghapus interval:

window.clearInterval(id);

// Initiate set interval and assign it to intervalListener
var intervalListener = self.setInterval(function () {someProcess()}, 1000);
function someProcess() {
  console.log('someProcess() has been called');
  // If some condition is true clear the interval
  if (stopIntervalIsTrue) {
    window.clearInterval(intervalListener);
  }
}

the_int=window.clearInterval(the_int);

Cara paling sederhana yang bisa saya pikirkan: tambahkan kelas.

Cukup tambahkan kelas (pada elemen apa saja) dan periksa di dalam interval jika ada. Ini lebih dapat diandalkan, dapat disesuaikan dan lintas bahasa daripada cara lain, saya percaya.

var i = 0;
this.setInterval(function() {
  if(!$('#counter').hasClass('pauseInterval')) { //only run if it hasn't got this class 'pauseInterval'
    console.log('Counting...');
    $('#counter').html(i++); //just for explaining and showing
  } else {
    console.log('Stopped counting');
  }
}, 500);

/* In this example, I'm adding a class on mouseover and remove it again on mouseleave. You can of course do pretty much whatever you like */
$('#counter').hover(function() { //mouse enter
    $(this).addClass('pauseInterval');
  },function() { //mouse leave
    $(this).removeClass('pauseInterval');
  }
);

/* Other example */
$('#pauseInterval').click(function() {
  $('#counter').toggleClass('pauseInterval');
});

body {
  background-color: #eee;
  font-family: Calibri, Arial, sans-serif;
}
#counter {
  width: 50%;
  background: #ddd;
  border: 2px solid #009afd;
  border-radius: 5px;
  padding: 5px;
  text-align: center;
  transition: .3s;
  margin: 0 auto;
}
#counter.pauseInterval {
  border-color: red;  
}

<!-- you'll need jQuery for this. If you really want a vanilla version, ask -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<p id="counter">&nbsp;</p>
<button id="pauseInterval">Pause/unpause</button></p>