jQuery - AJAX load()方法

jQuery load()方法是 一种简单但功能强大的AJAX方法。

طريقة load() في jQuery

jQuery load()يحمل البيانات من الخادم ويضع HTML العائدين في العنصر المحدد.

يقدم هذا الطريقة وسيلة بسيطة لتحميل بيانات من خادم الويب بشكل متزامن.

هذاload()نحوية الطريقة:

$(selector).load(URL,　data,　callback)

المعلمات:

• URL-تحديد URL الذي تريد طلبته

• data - محدد بشكل اختياري objekt بسيط أو string يتم إرساله مع الطلب إلى الخادم

• callback-محدد بشكل اختياري دالة المراجعة التي يتم تنفيذها عند اكتمال عملية load()

مثال أدناه يحمل محتويات ملف ajax_intro.txt إلى عنصر DIV:

$("button").click(function(){
　　$("div").load("ajax_intro.txt");
});

مثال أدناه يحمّل صفحة ajax_post.html ويقوم بإرسال بعض البيانات الأخرىبيانات:

$("button").click(function(){
　　let　data　=　{fname:"Seagull",　lname:"Anna"};
　　$("div").load("ajax_post.php",　data);
});

هذا هو شكل ملف PHP ("ajax_post.html"):

<?php
　　　　echo "<p>Hello ".$_POST['fname'].' '.$_POST['lname'].", How are u doing?</p>";
?>

طريقة الطلب:إذا تم تعيينبياناتإذا تم تقديمها كـobject، يتم استخدام طريقة POST. وإلا، يتم افتراض GET.

استخدام المراجعة لتحميل الصفحة

اختياريcallbackتحديد المعلماتload()دالة المراجعة التي يتم تشغيلها عند اكتمال العملية.

يمكن أن يكون لدى الدالة المراجعة إحدى هذه الأنواع من المعلمات:

• response　 - يحتوي على بيانات النتيجة في الطلب

• status - يحتوي على حالة الطلب ("success", "notmodified", "error", "timeout", أو "parsererror")

• xhr-يحتوي علىobjekt XMLHttpRequest

مثال أدناه يقوم بتحميل صفحة ajax_post.html并发رسل بعض البيانات الأخرى وأخبار حالة الرسالة:

$("button").click(function(){
　　let　data　=　{fname:"Seagull",　lname:"Anna"};
　　$("div").load("ajax_post.php",　data,　function(response,　status){
　　　　alert(status);
　　});
});

مثال أدناه يظهر إعلامًا عند حدوث خطأ في طلب Ajax:

$("button").click(function(){
　　let　data　=　{fname:"Seagull",　lname:"Anna"};
　　$("#success").load("wrong_file.php",　data,　function(response,　status,　xhr){
　　　　if(status　==　"error"){
　　　　　　let　msg　=　"Sorry　but　there　was　an　error:　";
　　　　　　$("#error").html(msg　+　xhr.status　+　"　"　+　xhr.statusText);
　　　　}
　　});
});

تحميل أجزاء الصفحة

jQuery load()يسمح لنا هذا الأسلوب أيضًا بتحميل جزء من المستند.

يمكن تحقيق ذلك بسهولة عن طريق إضافة مسافات خالية بعد معامل URL مع مصفوفة jQuery.

في هذا المثال، سيتم تحميل محتويات العنصر الذي له ID "table" في ملف "ajax_load.html" إلى عنصر DIV:

$("button").click(function(){
　　$("div").load("ajax_load.html　#table");
});

مرجع AJAX لـ jQuery

للحصول على مرجع كامل لمتغيرات AJAX، يرجى زيارةمرجع AJAX لـ jQuery.