معالج أحداث لوحة المفاتيح هو أداة قوية تسمح لمطوري الويب بإنشاء تطبيقات ويب تفاعلية وديناميكية. باستخدام لوحة المفاتيح ، يمكن للمستخدمين التفاعل مع الموقع عن طريق الضغط على المفاتيح وتنفيذ إجراءات مختلفة. يتيح لك استخدام معالج أحداث لوحة المفاتيح تتبع ضغطات المفاتيح وتنفيذ إجراءات معينة وفقا لها.
يتضمن معالج الأحداث من لوحة المفاتيح أحداثا مثل الضغط على مفتاح وتحرير مفتاح والضغط باستمرار على مفتاح. لاستخدام هذا المعالج ، تحتاج إلى إنشاء وظيفة سيتم استدعاؤها في كل مرة يحدث فيها حدث معين للوحة المفاتيح. باستخدام هذه الوظيفة ، يمكنك تحديد الإجراء الذي يجب تنفيذه استجابة للضغط على مفتاح معين أو مجموعة مفاتيح معينة.
في مثال التعليمات البرمجية أعلاه ، يتم استخدام معالج الأحداث كيدون ، الذي يتم تشغيله عند الضغط على مفتاح على لوحة المفاتيح. يوجد داخل الوظيفة شرط يتحقق مما إذا كان المفتاح المضغوط هو مفتاح الإدخال. إذا كانت هذه هي الحالة ، فسيتم تنفيذ إجراء معين — يتم عرض رسالة باستخدام وظيفة التنبيه (). يمكنك تغيير التعليمات البرمجية داخل كتلة الشرط لتنفيذ إجراء آخر استجابة لضغطة مفتاح.
يمكن أن يؤدي استخدام معالج أحداث لوحة المفاتيح إلى تحسين تجربة المستخدم بشكل كبير على موقع الويب الخاص بك. على سبيل المثال ، يمكنك استخدامه للتبديل بين أقسام الموقع باستخدام مفاتيح الأسهم أو لتنفيذ إجراءات معينة عند الضغط على المفاتيح في صفحة معينة. استخدام معالج الحدث لوحة المفاتيح وتوسيع قدرات تطبيق الويب الخاص بك!
- معالج الأحداث من لوحة المفاتيح
- دليل التعليمات
- أمثلة التعليمات البرمجية
معالج الأحداث من لوحة المفاتيح
للعمل مع أحداث لوحة المفاتيح في بيئة المتصفح ، لوحة مفاتيح خاصةيتم استخدام كائن الحدث. يحتوي هذا الكائن على معلومات حول الحدث ، مثل رمز المفتاح ونوع الحدث والمعلومات المفيدة الأخرى.
معالجات الحدث لوحة المفاتيح يمكن استخدامها لمختلف المهام. على سبيل المثال ، يمكنك استخدامها للتبديل بين العناصر على صفحة ويب باستخدام مفاتيح علامة التبويب أو لإضافة مفاتيح الاختصار إلى وظائف معينة من التطبيق الخاص بك.
لإنشاء معالج أحداث من لوحة المفاتيح ، تحتاج إلى استخدام جافا سكريبت. فيما يلي مثال على معالج بسيط لحدث الضغط على مفتاح الإدخال:
يضيف الرمز أعلاه معالج حدث مفتاح إدخال إلى المستند. في كل مرة يتم فيها الضغط على مفتاح الإدخال ، سيتم عرض نافذة منبثقة بها رسالة "يتم الضغط على مفتاح الإدخال!".
يحتوي على الرمز الرقمي للمفتاح.
يمكن أن تكون معالجات أحداث لوحة المفاتيح مفيدة جدا عند تطوير تطبيقات الويب بتفاعل محسن. أنها تسمح للمستخدمين بالتفاعل بسهولة مع التطبيق الخاص بك باستخدام مفاتيح لوحة المفاتيح.
دليل التعليمات
لإضافة معالج أحداث من لوحة المفاتيح إلى صفحة الويب الخاصة بك ، ستحتاج إلى استخدام جافا سكريبت. في هذا القسم ، سنخبرك بكيفية القيام بذلك وتقديم بعض أمثلة التعليمات البرمجية.
الخطوة 1: إنشاء وظيفة معالج
تتمثل الخطوة الأولى في إنشاء وظيفة معالج سيتم تشغيلها عند تشغيل حدث من لوحة المفاتيح. يجب أن تقبل وظيفة المعالج معلمة واحدة ، كائن حدث لوحة المفاتيح. على سبيل المثال:
وظيفة هاندكيدون (الحدث) {// رمز التعامل مع الحدث الخاص بك
أدفنتليستينر()
. يجب استدعاء هذه الطريقة على العنصر الهدف الذي تريد ربط المعالج به. على سبيل المثال ، إذا كنت تريد الرد على الأحداث الرئيسية على صفحة ويب بأكملها ، فيمكنك ربط معالج بكائن وثيقة.أدفنتليستينر ('كيدون' ، هاندكيدون);
إلى الحدث الصحافة مفتاح لوحة المفاتيح.
الخطوة 3 (اختياري): افصل المعالج عن الحدثإذا كنت بحاجة إلى إزالة معالج الأحداث في المستقبل ، فيمكنك استخدام
طريقة ريموفيفنتليستينر ()
. يجب استدعاء هذه الطريقة على نفس العنصر الذي كان المعالج ملزما به. على سبيل المثال:وثيقة.ريموفيفينتليستينر ('كيدون' ، هاندكيدون);
أمثلة التعليمات البرمجية:
مثال 1: التعامل مع الضغط على مفتاح معين
وظيفة هاندكيدون (الحدث) {
إذا (حدث.مفتاح = = = 'أدخل') {
تنبيه ('ضغطت على مفتاح الإدخال');
}
}
مثال 2: معالجة الضغط على أي مفتاح
وظيفة هاندكيدون (الحدث) {
وحدة التحكم.سجل ('لقد ضغطت على المفتاح:' + حدث.مفتاح);
}
لاحظ أنه في وظائف المعالج يمكنك تنفيذ أي رمز تحتاجه اعتمادا على احتياجاتك.
الآن لديك تعليمات وأمثلة التعليمات البرمجية لإضافة معالج حدث من لوحة المفاتيح إلى صفحة الويب الخاصة بك. حظا سعيدا مع المشاريع الخاصة بك!
أمثلة التعليمات البرمجية
فيما يلي أمثلة على التعليمات البرمجية توضح طرقا مختلفة للتعامل مع أحداث لوحة المفاتيح.
مثال 1:
في هذا المثال ، نضيف معالج أحداث للضغط على مفتاح الإدخال. عندما يضغط المستخدم على مفتاح الإدخال ، يتم الضغط على الرسالة"أدخل!"يتم عرض.
وثيقة.أديفنتليستينر ("كيدون" ، وظيفة (الحدث) {
إذا (حدث.مفتاح = = = "أدخل") {
وحدة التحكم.سجل ("أدخل الضغط!");
}
});
المثال 2:
في هذا المثال ، نقوم بإضافة معالج لحدث الضغط على مفتاح معين. في هذه الحالة ، نقوم بمعالجة الضغط على المفتاح "أ". عندما يضغط المستخدم على مفتاح " أ "، الرسالة " يتم الضغط على مفتاح!"يتم عرض.
وثيقة.أديفنتليستينر ("كيدون" ، وظيفة (الحدث) {
إذا (حدث.مفتاح = = = "أ") {