الانتقال إلى المحتوى الرئيسي

كيفية معرفة ما إذا تم النقر على زر باستخدام جافا سكريبت

جافا سكريبت هي لغة برمجة تستخدم على نطاق واسع لإنشاء صفحات ويب تفاعلية وديناميكية. واحدة من المهام الأكثر شيوعا التي يمكن حلها باستخدام جافا سكريبت هو تحديد ما إذا كان قد تم النقر على زر.

يعد النقر فوق زر أحد الأحداث الرئيسية التي نواجهها في تطوير الويب. باستخدام جافا سكريبت ، يمكنك بسهولة تحديد وقت الضغط على الزر بالضبط وتنفيذ إجراءات معينة بناء على هذا الحدث.

يمكن استخدام طرق مختلفة للكشف عن نقرات الأزرار في جافا سكريبت. واحدة من أبسط الطرق وأكثرها شيوعا هي ربط وظيفة بحدث نقرة زر واستدعاء هذه الوظيفة عند تشغيل الحدث. بهذه الطريقة ستتمكن من تنفيذ أي رمز أو إجراء عند النقر فوق الزر.

  1. مفهوم معالج الحدث
  2. إضافة معالج إلى زر
  3. طرق لتحديد ما إذا كان يتم الضغط على زر
  4. الطريقة 1: استخدام خاصية الحدث
  5. الطريقة 2: استخدام متغير العلم
  6. الطريقة 3: استخدام حالة الزر
  7. سؤال وجواب
  8. كيف يمكنني تحديد ما إذا كان قد تم النقر على زر باستخدام جافا سكريبت?
  9. هل من الممكن تحديد الزر الذي تم النقر عليه باستخدام جافا سكريبت?
  10. كيف يمكننا تحديد ما إذا كان قد تم النقر على زر إذا كان لدينا عدة أزرار على الصفحة?
  11. كيف يمكنني تنفيذ إجراءات مختلفة اعتمادا على الزر الذي تم الضغط عليه?

مفهوم معالج الحدث

معالج الأحداث هو دالة يتم تنفيذها عند حدوث حدث معين. في جافا سكريبت ، يمكن ربط الأحداث بإجراءات المستخدم المختلفة ، مثل نقرات الماوس وضربات المفاتيح وتحميل الصفحة وغيرها.

تستخدم جافا سكريبت آلية تسمى" مستمعي الأحداث " للعمل مع معالجات الأحداث. يسجل المستمعون على عنصر دوم معين ويتم استدعاؤهم عند حدوث الحدث المقابل.

مثال على معالج حدث قد يكون التعليمات البرمجية التالية:

انقر لي

// نحصل على رابط إلى الزر

زر كونست = وثيقة.جيتليمنتبيد ('بلدي زر');

// إضافة معالج لحدث "النقر"

زر.أدفنتليستينر ('انقر' ، وظيفة () {

تنبيه ('تم الضغط على الزر!');

});

في المثال أعلاه ، عند النقر فوق الزر باستخدام معرف= "الزر الخاص بي" ، يتم استدعاء وظيفة المعالج ، والتي تعرض نافذة منبثقة بها رسالة " تم الضغط على الزر!".

يمكن إنشاء معالجات الأحداث كوظائف مجهولة أو وظائف مسماة. الشرط الوحيد هو أن المعالج يجب أن يكون وظيفة. يمكن تنفيذ أي شفرة جافا سكريبت داخل المعالج ، بما في ذلك التفاعل مع عناصر دوم ، وتغيير أنماطها ، وإرسال الطلبات إلى الخادم ، وغيرها من العمليات.

إضافة معالج إلى زر

من أجل تتبع ما إذا كان قد تم النقر على زر باستخدام جافا سكريبت ، تحتاج إلى إضافة معالج الحدث إلى هذا الزر.

للقيام بذلك ، يمكنك استخدام طريقة أدفنتليستينر. تسمح لنا هذه الطريقة بتحديد الحدث الذي نريد مراقبته والوظيفة التي يجب الاتصال بها عند حدوث هذا الحدث.

مثال على الكود:

زر كونست = وثيقة.كيريسيليكتور ('زر');

زر.أدفنتليستينر ('انقر' ، () = > {

تنبيه ('يتم الضغط على زر!');

});

في هذا المثال ، نختار زرا باستخدام طريقة الاستعلام وحفظه في متغير الزر. ثم نستخدم طريقة أديفنتليستينر لإضافة معالج الحدث' انقر ' إلى الزر. عند الضغط على الزر ، سيتم استدعاء وظيفة مجهولة ، والتي تستدعي طريقة التنبيه لإظهار الرسالة " يتم الضغط على الزر!".

وبالتالي ، في كل مرة تنقر فيها على الزر ، تظهر الرسالة " يتم الضغط على الزر!"سيتم عرضها.

طرق لتحديد ما إذا كان يتم الضغط على زر

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

    دعنزر مضغوط = خطأ;

    زر.أدفنتليستينر ('ماوسوب' ، وظيفة () {

    الضغط = خطأ;

    // بعد ذلك ، يمكننا استخدام علامة الضغط على الزر لتحديد حالة الزر

    1. الملكية الحدث
    2. انقر على زر.
    3. وثيقة.جيتليمنتبيد ("زري").أدفنتليستينر ("انقر" ، وظيفة (الحدث) {

    إذا (حدث.اكتب = = = "انقر") {

    وحدة التحكم.سجل ("تم الضغط على الزر!");

    }

    وإذا كان يساوي "انقر" ، ونحن إخراج رسالة إلى وحدة التحكم.

    يمكنك استخدام هذه الطريقة لتنفيذ أي إجراءات عند النقر فوق الزر. على سبيل المثال ، يمكنك تغيير نمط عنصر أو إرسال البيانات إلى الخادم أو فتح نافذة جديدة.

    الطريقة 2: استخدام متغير العلم

    الطريقة الثانية لتحديد ما إذا كان يتم النقر على زر باستخدام جافا سكريبت هو استخدام متغير العلم. يعتمد هذا الأسلوب على تغيير قيمة المتغير عند الضغط على زر والتحقق من هذه القيمة لاحقا.

    خطوات تنفيذ هذه الطريقة:

    إنشاء متغير العلم الذي سيتم تخزين حالة الزر. يجب أن تكون القيمة الأولية للمتغير منطقية (على سبيل المثال,

    خطأ

    أو

    صحيح

    ).

    عند الضغط على الزر ، قم بتغيير قيمة المتغير إلى العكس (على سبيل المثال ، إذا كانت القيمة

    خطأ

    ، قم بتغييره إلى

    صحيح

    ).

    للتحقق مما إذا تم الضغط على الزر ، استخدم المشغل الشرطي (

    إذا

    ). إذا كانت قيمة متغير العلم تساوي

    إذا كان هذا صحيحا

    ، ثم تم الضغط على الزر. خلاف ذلك ، لم يتم الضغط على الزر.

    مثال على تنفيذ متغير العلم للتحقق مما إذا كان الزر