متد ajaxSuccess( callback ) در jQuery
دسته بندی : آموزش jQuery سطح مقاله : متوسط زمان مطالعه : 3 دقیقه آخرین بروز رسانی: 28 خرداد 1401متد ajaxSuccess( callback ) در jQuery در این مقاله از سری مقالات آموزش جی کوئری دویکس بررسی میشود. این متد تابعی را ضمیمه میکند تا هر زمان که درخواست AJAX با موفقیت انجام شد اجرا شود، این یک رویداد AJAX است.
ساختار متد
در اینجا نحو و ساختار ساده برای استفاده از این متد آمده است:
$(document).ajaxSuccess( callback )
پارامترهای متد ajaxSuccess( callback ) در jQuery
در اینجا تمام پارامترهای استفاده شده توسط این متد توضیح داده شده است:
- callback : تابعی که باید اجرا شود، شی رویداد، XMLHttpRequest و تنظیمات مورد استفاده برای آن درخواست به عنوان آرگومان به فراخوان ارسال میشود
مثال
با فرض اینکه در فایل result.html محتوای HTML زیر را داریم:
<h1>THIS IS RESULT...</h1>
حالا در قطعه کد زیر با یک مثال ساده نشان داده شده است که استفاده از این متد چگونه است:
<html>
<head>
<title>The jQuery Example</title>
<script type = "text/javascript"
src = "https://www.tutorialspoint.com/jquery/jquery-3.6.0.js">
</script>
<script type = "text/javascript" language = "javascript">
$(document).ready(function() {
/* Global variable */
var count = 0;
$("#driver").click(function(event){
$('#stage0').load('result.html');
});
/* Gets called when request starts */
$(document).ajaxStart(function(){
count++;
$("#stage1").html("<h1>Starts, Count :" + count + "</h1>");
});
/* Gets called when request is sent */
$(document).ajaxSend(function(evt, req, set){
count++;
$("#stage2").html("<h1>Sends, Count :" + count + "</h1>");
$("#stage2").append("<h1>URL :" + set.url + "</h1>");
});
/* Gets called when request completes */
$(document).ajaxComplete(function(event,request,settings){
count++;
$("#stage3").html("<h1>Completes,Count:" + count + "</h1>");
});
/* Gets called when request is stopped */
$(document).ajaxStop(function(event,request,settings){
count++;
$("#stage4").html("<h1>Stops, Count :" + count + "</h1>");
});
/* Gets called when all request completes successfully */
$(document).ajaxSuccess(function(event,request,settings){
count++;
$("#stage5").html("<h1>Success,Count :" + count + "</h1>");
});
});
</script>
</head>
<body>
<p>Click on the button to load result.html file:</p>
<div id = "stage0" style = "background-color:blue;">
STAGE - 0
</div>
<div id = "stage1" style = "background-color:blue;">
STAGE - 1
</div>
<div id = "stage2" style = "background-color:blue;">
STAGE - 2
</div>
<div id = "stage3" style = "background-color:blue;">
STAGE - 3
</div>
<div id = "stage4" style = "background-color:blue;">
STAGE - 4
</div>
<div id = "stage5" style = "background-color:blue;">
STAGE - 5
</div>
<input type = "button" id = "driver" value="Load Data" />
</body>
</html>
مطالعه مقاله بررسی Ajax در jQuery برای دسترسی به لیست کامل متدهای Ajax در جی کوئری به شما پیشنهاد میشود؛ امیدواریم از مطالعه این مقاله آموزش jQuery لذت برده باشید. لطفاً نظرات خود را با ما به اشتراک بگذارید و سئوالات خود را در بخش نظرات مطرح کنید.
این مقاله چقدر براتون مفید بود؟