javascript settimeout cancel

JavaScript ialah bahasa pengaturcaraan popular yang boleh digunakan untuk menulis elemen interaktif dan logik dalam aplikasi web. Antaranya, setimeout ialah fungsi terbina dalam JavaScript, yang boleh melaksanakan kod yang ditentukan selepas kelewatan tertentu. Walau bagaimanapun, kadangkala adalah perlu untuk membatalkan pemasa setTimeout semasa pelaksanaan. Artikel ini akan memperkenalkan cara membatalkan pemasa setTimeout menggunakan bahasa JavaScript.

1. Gambaran keseluruhan asas fungsi setTimeout

Sebelum memperkenalkan cara membatalkan setTimeout, mari kita fahami penggunaan asas dan konsep fungsi setTimeout.

Fungsi setTimeout ialah fungsi global dalam JavaScript Fungsinya adalah untuk menangguhkan pelaksanaan kod yang ditentukan selepas tempoh masa tertentu. Penggunaan khusus adalah seperti berikut:

setTimeout(function(){
  //执行的代码
},延迟的毫秒数)

Antaranya, fungsi mewakili fungsi yang akan ditangguhkan, dan bilangan milisaat untuk ditangguhkan ialah parameter jenis angka yang menunjukkan masa untuk ditangguhkan, dalam milisaat. Contohnya, jika anda ingin melaksanakan fungsi selepas 500 milisaat, anda boleh menggunakan kod berikut:

setTimeout(function(){
  console.log('延迟500毫秒后执行的代码。')
},500)

2. Cara menggunakan fungsi clearTimeout untuk membatalkan pemasa setTimeout

Masa tunda dalam fungsi setTimeout terlalu panjang Atau apabila ragu-ragu, anda mungkin perlu membatalkan pemasa semasa operasi. Pada masa ini, anda boleh menggunakan fungsi clearTimeout bagi objek tetingkap. Fungsi ini boleh membatalkan jeda fungsi setTimeout yang masih belum dilaksanakan.

Fungsi clearTimeout digunakan seperti berikut:

var timer = setTimeout(function(){
  console.log('延迟执行的代码。')
},3000)

//取消计时器
clearTimeout(timer);

Dalam contoh kod di atas, pembolehubah bernama pemasa ditakrifkan untuk menyimpan pemasa last1, dan kemudian fungsi clearTimeout digunakan untuk membatalkan pemasa . Dengan cara ini, jika anda perlu membatalkan kelewatan sebelum melaksanakan kod, anda boleh menggunakan fungsi clearTimeout.

3 Pemasa setTimeout boleh dibatalkan, tetapi kod dalaman tidak boleh dihentikan

Perlu diambil perhatian bahawa pemasa boleh dibatalkan melalui fungsi clearTimeout, tetapi kod dilaksanakan dalam pemasa tidak boleh dihentikan. Ini bermakna jika anda mentakrifkan fungsi yang sentiasa dilaksanakan di dalam fungsi setTimeout, walaupun pemasa dibatalkan, fungsi akan terus dilaksanakan sehingga fungsi selesai.

Sebagai contoh, dalam contoh kod berikut, fungsi setInterval ditakrifkan yang dilaksanakan sekali setiap saat Walaupun pemasa dibatalkan, fungsi akan berhenti selepas melaksanakan sekali.

var timer = setTimeout(function(){
  setInterval(function(){
    console.log('每秒执行一次的代码。')
  },1000)
},5000)

//取消计时器
clearTimeout(timer)

4. Aplikasi praktikal setTimeout dan clearTimeout

Sekarang mari kita lihat aplikasi praktikal setTimeout dan clearTimeout.

Dalam aplikasi praktikal, fungsi setTimeout dan fungsi clearTimeout biasanya digunakan dalam senario seperti kod yang perlu ditangguhkan, kod yang perlu ditinjau dan maklum balas kepada pengguna. Contohnya:

1. Perlaksanaan kod tertunda

Dalam sesetengah senario yang memerlukan menunggu tempoh masa sebelum pelaksanaan, anda boleh menggunakan fungsi setTimeout untuk mencapai ini, seperti sebagai melengkapkan carian secara automatik selepas pengguna memasukkan Petua:

var timer;
function handleChange(){
  clearTimeout(timer)
  timer = setTimeout(function(){
    console.log('自动完成搜索提示')
  },500)
}

2. Kod undian

Dalam beberapa senario yang memerlukan kemas kini masa nyata, anda boleh menggunakan fungsi setInterval untuk melaksanakan pengundian. Contohnya, kemas kini data daripada pelayan sekali-sekala:

var timer = setInterval(function(){
  console.log('从服务器轮询数据')
},5000)

//取消轮询
clearInterval(timer)

3. Kod maklum balas

Dalam sesetengah senario di mana maklum balas perlu diberikan kepada pengguna, fungsi setTimeout boleh digunakan. Contohnya, undur, lakukan operasi tertentu selepas menunggu, dsb.:

var count = 10;
var timer = setInterval(function(){
  count--
  console.log('还有' + count + '秒...')
  if(count == 0){
    clearInterval(timer)
    console.log('倒计时结束')
  }
},1000)

Diambil bersama, fungsi setTimeout dan fungsi clearTimeout adalah sangat mudah, tetapi ia boleh memainkan peranan besar dalam aplikasi praktikal, menjadikan halaman web lebih berfungsi dan kaya antara muka.

Atas ialah kandungan terperinci javascript settimeout cancel. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!