يمكن أن تكون مشغلات الأحداث مفهومة جيدًا حرفيًا ، وتستخدم لإطلاق الأحداث ، لكن بعض الأصدقاء الذين لم يستخدموها قد يكونون مرتبكين. هل عادة ما تنشأ الأحداث العمليات الفعلية للمستخدمين على الصفحة؟ هذا العرض غير صحيح تمامًا ، لأنه يجب تنفيذ بعض الأحداث من قبل البرامج ، مثل الأحداث المخصصة ، ويجب تنفيذ بعض الأحداث المخصصة لإطار Ajax's Ajax من قبل محفزات الأحداث. بطبيعة الحال ، في بعض الحالات الخاصة ، من المناسب استخدام مشغلات الأحداث لتشغيل الأحداث بدلاً من تشغيل الأحداث من خلال العمليات الفعلية للمستخدم.
يمتلك المتصفح طرقًا أصلية لدعم تنفيذ مشغلات الأحداث ، ولكن هناك اختلافات كبيرة في التوافق. من المتوقع تماما مشكلة التوافق هذه. IE لها أساليبها الخاصة ، والمتصفحات القياسية الأخرى لديها أيضًا مجموعة من الأساليب. ناهيك عن أساليبها جيدة أو سيئة ، لمطوري الويب ، إنها تعذيب للمطورين لتطوير عدة طرق. تدعم IE طريقة FireEvent لتنفيذ حدث التشغيل ، ودعم المتصفحات القياسية DispatchEvent لتنفيذ الحدث الذي يثير ، وكلاهما دعم IE9. فيما يلي رمز المصدر من النموذج الأولي (في الواقع قمت بنسخه من مدونة Situ Zhengmei):
نسخة الكود كما يلي:
var fireevent = function (element ، event) {
if (document.createEventObject) {
// IE Browser يدعم طريقة FireEvent
var evt = document.createEventObject () ؛
return element.fireevent ("On"+حدث ، EVT)
}
آخر{
// تستخدم المتصفحات القياسية الأخرى طريقة الإرسال
var evt = document.createEvent ('htmlevents') ؛
// initevent يقبل 3 معلمات:
// نوع الحدث ، سواء كان ذلك متهورًا ، سواء كان ذلك يحظر سلوك المتصفح الافتراضي
evt.Initevent (الحدث ، صحيح ، حقيقي) ؛
إرجاع! element.dispatchevent (evt) ؛
}
} ؛
الطريقة أعلاه متوافقة مع المتصفحات السائدة لتنفيذ وظيفة مشغلات الأحداث. ومع ذلك ، بالنسبة لبعض أنظمة معالجة الأحداث المغلفة ، مثل وحدة الحدث من jQuery ، فإنها ليست بهذه البساطة ، ولا يمكن تنفيذها إلا من خلال المحاكاة. لقد كتبت نظامًا بسيطًا للغاية لمعالجة الأحداث من قبل ، وواجهت مؤخرًا الحاجة إلى الأحداث المخصصة ، لذلك قمت بمحاكاة تشغيل حدث بناءً على نظام الأحداث السابق ، والرمز كما يلي:
نسخة الكود كما يلي:
/**
* الزناد الحدث
* param {object} عنصر dom
* param {string / object} نوع الحدث / كائن الحدث
* param {array} تم تمرير معلمات إضافية إلى وظيفة معالج الأحداث
* param {boolean} هل هو فقاعة
*/
الزناد: وظيفة (Elem ، الحدث ، البيانات ، isStopPropagation) {
var type = event.type || حدث،
// Bubble Parent Element ، على طول الطريق للتوثيق ، النافذة
Parent = elem.parentNode ||
elem.OwnerDocument ||
Elem === Elem.OwnerDocument && Win ،
EventHandler = $ .Data (elem ، type + 'Handler') ؛
isStopPropagation = typeof data === 'Boolean'؟
البيانات: (isStopPropagation || false) ؛
البيانات = البيانات && isarray (البيانات)؟ بيانات : []؛
// إنشاء كائن حدث مخصص
event = typeof event === 'Object'؟
حدث : {
النوع: اكتب ،
PrepantDefault: noop ،
التوقف: function () {
isStopPropagation = صحيح ؛
}
} ؛
event.target = elem ؛
data.unshift (حدث) ؛
إذا (EventHandler) {
EventHandler.Call (Elem ، Data) ؛
}
// اتصل بشكل متكرر لمحاكاة الفقاعات
if (parent &&! isStopPropagation) {
data.shift () ؛
this.trigger (الوالد ، الحدث ، البيانات) ؛
}
}
مبدأ المحاكاة ليس صعبًا. ربط وظيفة معالجة الأحداث لعنصر معين. إذا كان هناك عملية فعلية لإطلاق حدث ما ، فسيتم تنفيذ وظيفة معالجة الأحداث المقابلة. لذلك ، لتحقيق وظيفة مشغل الحدث ، فقط الحصول على وظيفة معالجة الأحداث المقابلة وتنفيذها. هذا هو الأكثر أساسية.
عند حدوث الحدث الفعلي ، سيقوم المتصفح بإنشاء كائن حدث ، والذي يحتوي على بعض السمات والمعلومات عند حدوث الحدث. إذا لم يكن هناك حدث فعلي ، فلا يوجد كائن أحداث ، وبالتالي فإن الكود أعلاه ينشئ أيضًا كائن حدث لتلبية الوظائف الأساسية.
هناك أيضا الأحداث التي فقاعة. إذا لم تحدث أحداث فعلية ، فلن يكون هناك بطبيعة الحال لا سلوك فقاعة. ثم إذا كنت ترغب في محاكاة وظيفة الفقاعة ، فيجب عليك البحث باستمرار عن العنصر الأصل والتحقق مما إذا كان نفس النوع من الحدث مرتبطًا حتى المستند والنافذة. إذا كان الهيكل معقدًا ، فمن المقدر أن يكون أداء طريقة الاتصال العودية هذه غير جيد جدًا.
أخيرًا ، هناك سلوك افتراضي للمتصفح. أعتقد أنه أمر مزعج للغاية لمحاكاة هذا ، مزعج للغاية لدرجة أنني لا أعرف كيفية تنفيذه. على سبيل المثال ، القفزة الافتراضية للعلامة. لقد اختبرت مشغل jQuery ، لكن لم يتم تنفيذه ، ولكن يبدو أن بعض السلوكيات الأخرى قد تم تقديمها في دليل API. بعد كل شيء ، هذه الوظيفة ليست مهمة للغاية ، ولم أجري الكثير من الأبحاث المتعمقة بعد.