jQuery 3.3

.load()




jquery

.load (handler) الإرجاع: إصدار jQuery deprecated: 1.8 ، removed: 3.0

الوصف: ربط أحد معالجات الأحداث بحدث JavaScript "تحميل".

  • الإصدار المضاف: 1.0 .load (معالج)

    • معالج
      النوع: Function ( Event eventObject)
      دالة يتم تنفيذها عند تشغيل الحدث.
  • الإصدار المضاف: 1.4.3 .load ([eventData] ، معالج)

    • eventData
      النوع: Anything
      كائن يحتوي على بيانات سيتم تمريرها إلى معالج الحدث.
    • معالج
      النوع: Function ( Event eventObject)
      هي وظيفة يتم تنفيذها في كل مرة يتم فيها تشغيل الحدث.

هذه الطريقة هي اختصار لـ .on( "load", handler ) .

يتم إرسال حدث load إلى عنصر عندما يتم تحميل كافة العناصر الفرعية بالكامل. يمكن إرسال هذا الحدث إلى أي عنصر مرتبط بعنوان URL: الصور والنصوص والإطارات و iframes وكائن window .

على سبيل المثال ، ضع في اعتبارك صفحة ذات صورة بسيطة:

<img src="book.png" alt="Book" id="book">

يمكن ربط معالج الحدث بالصورة:

$( "#book" ).load(function() {
  // Handler for .load() called.
});

بمجرد تحميل الصورة ، يتم استدعاء المعالج.

بشكل عام ، ليس من الضروري الانتظار حتى يتم تحميل جميع الصور بالكامل. إذا كان يمكن تنفيذ التعليمة البرمجية في وقت سابق ، فمن الأفضل عادة وضعها في معالج تم إرساله إلى طريقة. .ready() .

لدى وحدة Ajax أيضاً أسلوب المسمى .load() . الذي يتم تشغيله يعتمد على مجموعة من الحجج التي تم تمريرها.

تحذيرات من حدث load عند استخدامها مع الصور

من .load() الشائعة التي يحاول المطورون حلها باستخدام الاختصار .load() تنفيذ وظيفة عند تحميل صورة (أو مجموعة صور) بالكامل. هناك العديد من التحذيرات المعروفة بهذا يجب ملاحظة ذلك. هؤلاء هم:

  • إنها لا تعمل باستمرار ولا عبر المتصفح بشكل موثوق
  • لا يتم إطلاقه بشكل صحيح في WebKit إذا تم تعيين الصورة src إلى src نفسه كما كان من قبل
  • لا يقوم بتلقيم شجرة DOM بشكل صحيح
  • يمكن أن تتوقف عن إطلاق النار على الصور التي تعيش بالفعل في ذاكرة التخزين المؤقت للمتصفح

ملاحظة: لا يمكن استخدام .live() و .delegate() للكشف عن حدث load .delegate() iframe. لم يقم حدث التحميل باحتواء المستند الأصل بشكل صحيح ولم يتم تعيين event.target بواسطة Firefox أو IE9 أو Chrome ، وهو مطلوب لتنفيذ تفويض الحدث.

أمثلة:

قم بتشغيل وظيفة عندما يتم تحميل الصفحة بالكامل بما في ذلك الرسومات.

$( window ).load(function() {
  // Run code
});

أضف فئة bigImg إلى جميع الصور التي يزيد ارتفاعها عن 100 عند كل تحميل للصورة.

$( "img.userIcon" ).load(function() {
  if ( $( this ).height() > 100) {
    $( this ).addClass( "bigImg" );
  }
});