Comment appeler une fonction après avoir attendu un certain temps – JQuery

juin 30, 2019février 10, 2020 Amine KOUIS Aucun commentaire

L’exemple suivant vous montrera comment appeler une fonction après avoir attendu un certain temps. L’exemple utilise la méthode delay() de jQuery pour définir l’intervalle de temps du retard.

Code source :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Appeler une fonction après avoir attendu un certain temps</title>
		<style type="text/css">
			.box{
				display: none;
				width: 300px;
			       border: 15px solid green;
			       padding: 50px;
			}
		</style>
		<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
		<script type="text/javascript">
			function showBox(){
				$("div.box").fadeIn(600);
			}
			$(document).ready(function(){ 
				$(".show-box").click(function(){
					$(this).text('loading...').delay(1000).queue(function() {
						$(this).hide();
						showBox(); 
						$(this).dequeue();
					});        
				});
			});
		</script>
	</head>
	<body>
		<button type="button" class="show-box">Show Box</button>
		<div class="box"></div>
	</body>
</html>