Définit la couleur du texte
La méthode ajaxStart() est utilisée pour spécifier la fonction à exécuter lors du lancement d'une requête AJAX.
La méthode ajaxStart() est utilisée pour spécifier la fonction à exécuter au démarrage d'une requête AJAX. Syntaxe :
$(document).ajaxStart(function())
Paramètre: Il ne prend qu'un seul paramètre.
function() : Il spécifie la fonction à exécuter lorsque la requête Ajax démarre.
Exemple-1 : Cet exemple change le contenu de l'élément p , en prenant les données du serveur. Quand la requête commence, la page dit AJAX requête commence.
Code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>jQuery AJAX la méthode ajaxStart()</title>
<script type="text/javascript"
src=" https://code.jquery.com/jquery-3.6.0.min.js "></script>
<script>
$(document).ready(function() {
$(document).ajaxStart(function() {
alert("La requête AJAX vient de commencer");
});
$("button").click(function() {
$("#paragraph").load("//www.oujood.com/jquery/test/test1.txt");
});
});
</script>
<style>
body {
text-align: center;
}
</style>
</head>
<body>
<h1 style="color:green">www.oujood.com</h1>
<h2>jQuery la méthode ajaxStart()</h2>
<h3>Laiser ajax faire le travail</h3>
<!--******************************************-->
<div id="div_content">
<p id="paragraph"
style="font-size: 20px;">
Apprendre le dévelopement web avec oujood.com
</p>
</div>
<button>Changer Contenu</button>
</body>
</html>
Exemple-2: Cet exemple change le contenu de l'élément h3 , en prenant les données du serveur. Lorsque la requête démarre, la page indique AJAX request started.
Code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>jQuery AJAX la méthode ajaxStart()</title>
<script type="text/javascript"
src=" https://code.jquery.com/jquery-3.6.0.min.js "></script>
<script>
$(document).ready(function() {
$(document).ajaxStart(function() {
alert("AJAX request started");
});
$("button").click(function() {
$("h3").load("//www.oujood.com/jquery/test/test1.txt").css({'color':'red'});
});
});
</script>
<style>
body {
text-align: center;
}
</style>
</head>
</head>
<body>
<h1 style="color:green">www.oujood.com</h1>
<h2>jQuery la méthode ajaxStart()</h2>
<h3>Laiser ajax faire le travail</h3>
<!--******************************************-->
<div id="div_content">
<p id="paragraph"
style="font-size: 20px;">
Apprendre le dévelopement web avec oujood.com
</p>
</div>
<button>Changer Contenu</button>
</body>
</html>
Par gerywa le 01 mars 2022