Maison interface Web js tutoriel Javascript延迟执行实现方法(setTimeout)_javascript技巧

Javascript延迟执行实现方法(setTimeout)_javascript技巧

May 16, 2016 pm 06:12 PM
settimeout 延迟执行

1。延迟切换tab
需求:页面上有几个tab,切换tab的时候,会对某个特定区域的数据进行拉取更新。
弊端:用户从第一个tab切换一直快速切到尾,就会产生n个ajax请求。其实用户只是需要看到最后一个tab的数据。
复制代码 代码如下:

var changeTab = function(){
var timeId = 0;
return function(tabId){
if(timeId){
clearTimeout(timeId);
timeId=0;
}
setTimeout(function(){
//ajax do something
},500);
};
}();

一个比较简单的例子,绑定在tab上的onmouseover,如果用户不停的来回切换tab,ajax请求不会执行,只有停顿500毫秒后,才会执行,500毫秒,其实蛮短的,基本上不会影响到用户体验。

2。延迟自动完成
需求:在文本输入框中,监听用户输入,实现自动完成功能。
弊端:用户每输入一个字符,都会产生一个ajax请求,如果用户连续输入了一长串内容,请求次数就很多,实际上,最后的那次,才是用户需要的。
代码与上面例子类似。

3。延迟滚动
需求:页面的广告,需要用户滚动到哪,就跟到哪。
弊端:用户滚动在底,触发了N次的让广告重新定位的函数。其实,只需要当用户停下的时候,才触发一次就足够了。
代码与1类似。

其实有很多这样这样的例子,有些事情,不需要马上去执行,可以延迟一点时间才执行,时间很短,不影响用户体验,又可以减少很多不必要的消耗。
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment exécuter une fonction en php après quelques secondes Comment exécuter une fonction en php après quelques secondes Apr 24, 2022 pm 01:12 PM

Méthode d'implémentation : 1. Utilisez l'instruction « sleep (delay seconds) » pour retarder l'exécution de la fonction de plusieurs secondes ; 2. Utilisez l'instruction « time_nanosleep (delay seconds, delay nanoseconds) » pour retarder l'exécution de la fonction de plusieurs secondes ; secondes et nanosecondes ;3. Utilisez l'instruction "time_sleep_until(time()+7)".

Analyse des causes et des effets de l'exécution retardée de jQuery Analyse des causes et des effets de l'exécution retardée de jQuery Feb 27, 2024 pm 04:42 PM

jQuery est une bibliothèque JavaScript populaire qui fournit une multitude de fonctions et de méthodes, ce qui simplifie grandement le processus d'écriture et de programmation de code JavaScript. Lors de l'utilisation de jQuery, nous rencontrons souvent des situations dans lesquelles nous devons retarder l'exécution de certaines opérations. Ce retard d'exécution joue un rôle important dans le développement réel. Cet article explorera les raisons et les effets de l'exécution retardée de jQuery et fournira des exemples de code spécifiques. 1. Pourquoi est-il nécessaire de retarder l’exécution ? Dans le développement front-end, il faut parfois attendre

Quelle est la différence entre settimeout et setinterval Quelle est la différence entre settimeout et setinterval Aug 15, 2023 pm 02:06 PM

La différence entre settimeout et setInterval : 1. Temps de déclenchement, settimeout est unique, il exécute la fonction une fois après avoir défini le temps de retard, tandis que setinterval est répétitif, il exécutera la fonction à plusieurs reprises à l'intervalle de temps défini ; , settimeout n'est exécuté qu'une seule fois et setinterval sera exécuté à plusieurs reprises jusqu'à son annulation.

Utilisation intelligente de l'exécution retardée des fonctions Golang Utilisation intelligente de l'exécution retardée des fonctions Golang Apr 25, 2024 pm 02:21 PM

La fonctionnalité d'exécution paresseuse du langage Go permet aux programmeurs d'exécuter des appels de fonction après le retour de la fonction. Ses principaux cas d'utilisation incluent : Initialisation paresseuse : retarder l'initialisation d'objets ou de structures volumineux jusqu'à ce que cela soit nécessaire. Post-traitement : effectuez des opérations de nettoyage ou de post-traitement après le retour de la fonction. Programmation simultanée : planifiez des tâches en arrière-plan pour qu'elles s'exécutent en dehors de la goroutine principale.

Discutez de la mise en œuvre technique et des avantages de l'exécution différée de jQuery Discutez de la mise en œuvre technique et des avantages de l'exécution différée de jQuery Feb 28, 2024 am 08:09 AM

jQuery est une bibliothèque JavaScript très populaire et largement utilisée dans le développement Web. Dans le processus de développement Web, nous rencontrons souvent des situations dans lesquelles nous devons retarder l'exécution de certaines opérations, et jQuery propose une variété de méthodes pour obtenir une exécution retardée. Cet article explorera la mise en œuvre technique de l'exécution retardée de jQuery et ses avantages. 1. Utilisez la fonction setTimeout pour implémenter une exécution différée. La fonction setTimeout est une fonction de minuterie fournie par JavaScript. Elle peut être exécutée après un intervalle de temps spécifié.

Quelle est la différence entre setTimeout() et setInterval() en JavaScript ? Quelle est la différence entre setTimeout() et setInterval() en JavaScript ? Sep 01, 2023 pm 03:01 PM

setTimeout(function,duration) - Cette fonction appelle la fonction après une durée de quelques millisecondes. Cela fonctionne pour une seule exécution. Voyons un exemple - il attend 2000 millisecondes puis exécute la fonction de rappel alert('Hello') - setTimeout(function(){alert('Hello');},2000); setInterval(function,uration) - cette fonction is La fonction est appelée toutes les millisecondes de durée. Cela peut être fait un nombre illimité de fois. Voyons un exemple - il déclenche une alarme toutes les 2000 ms

Utilisez la fonction clearTimeout en JavaScript pour annuler le minuteur setTimeout Utilisez la fonction clearTimeout en JavaScript pour annuler le minuteur setTimeout Nov 18, 2023 am 08:05 AM

Pour utiliser la fonction clearTimeout en JavaScript pour annuler le minuteur setTimeout, vous avez besoin d'exemples de code spécifiques. En JavaScript, la fonction setTimeout est utilisée pour exécuter un code spécifique après un délai spécifié. La fonction setInterval est utilisée pour exécuter à plusieurs reprises un code spécifique dans un intervalle de temps spécifié. Cependant, dans certains cas, nous devrons peut-être annuler le minuteur avant son exécution. Dans ce cas, vous pouvez utiliser c

Pourquoi jQuery a-t-il besoin d'une exécution différée ? Analyse et pratique Pourquoi jQuery a-t-il besoin d'une exécution différée ? Analyse et pratique Feb 27, 2024 pm 06:12 PM

Pourquoi jQuery a-t-il besoin d’une exécution différée ? Analyse et pratique Dans le développement front-end, jQuery est une bibliothèque JavaScript largement utilisée. Elle simplifie les opérations DOM, le traitement des événements, les effets d'animation et d'autres fonctions, offrant ainsi une commodité aux développeurs. Cependant, nous rencontrerons parfois des problèmes, c'est-à-dire que dans certaines circonstances, jQuery doit retarder l'exécution pour obtenir l'effet souhaité. Cet article analysera pourquoi jQuery nécessite une exécution retardée du point de vue des principes et de la pratique, et fournira des exemples de code spécifiques. un,

See all articles