التصنيفات
JavaScript

الأحداث في الجافا سكريبت events

السلام عليكم

بعد ساعتين تقريباً من كتابة أكواد JavaScript والأندماج مع الأحداث event – إن صحة التسمية – فأحببت تسجيل بعض منهم.

المقصود بحدث : مثلاً onClick أو ondblclick أو ….

الفائدة من الأحداث : هي تعبر أساس أجراء عمليات الـJavaScript فمثلاً لو أحببنا نظهر رسالة "مرحباً بك أيها الزائر" فسنسنتخدم الدالة alert وهي دالة لها مدخل واحد وهو الرسالة؛.

أين أستخدام الأحداث إذاً؟
سوف أبلغك … لعرض هذه الرسالة عند بداية تحميل الصفحة فسنستخدم الحدث onLoad في تاج body بالشكل الأتي :-
<body onLoad="alert('مرحباً بك')">

اما لعرضه عند الضغط على زر أرسال مثلاً

<input type="submit" onClick="alert('مرحباً بك')" />

بعض الأحداث وفائدتها
onLoad : في بداية ظهور الصفحة أو الكائن المستخدم معه هذا الحدث ويمكن أستخدامه مع (body و frame و frameset و iframe و img و link و script)
onUnload : مثل السابق ولكن في النهاية بدل البداية … مثال
<body onUnload="alert('شكراً لزيارتك موقعنا')">
onError : يمكن أستخدامه في الBody أيضاً لعمل حدث معين لو حدث خطأ أو مع الصور أيضاً … مثال :-
<img src="image.gif" onerror="alert('The image could not be loaded.')" />
onResize : تنفذ عند تغير حجم الصفحة أو الكائن … مثال
<body onresize="alert('أوعى تحرك المحطة :S')">
onClick : عند الضغط على الكائن
ondblclick : عن الضغط مرتين على الكائن
onFocus : عند الوصول للكائن بالماوس او بأستخدام زر Tab
onkeyPress :عند الكتابة داخل هذا الكائن
onkeydown , onkeyup : أعتقد هذا مثال أفضل من الشرح
onmousedown , onmouseup : نفس وضيفة الالحدثين السابقين ولكن بأستخدام الـMouse أما السابقين لأزرة الـKeyWord
onMousemove , onMouseover : عند المرور على الكائن
onMouseout : عند خروج الـMouse من حيز الكائن
onReset : عند الضغط على زر reset داخل النموذج Form … المثال بعد التالي
onSubmit : عند الضغط على زر Submit او القيام بتنفيز الأرسال بأي طريقة … مثال
<body onreset="return confirm('سيتم تصفير الفورم')">
<body onsubmit="return confirm('متأكد')">

onSelect : تستخدم مع التاجات(Input و TextArea) وهي تنفز عند التعليم على الكلام بداخل أحد التاجين
onchange : وتستخدم عادتاً مع القوائم المنسدلة (Select) ولكن يمكن أستخدامها أيضاً مع (input type=text و textarea)
مثال بسيط
<input type="text" onchange="this.value = this.value.toUpperCase()" />

تحديث 21-3-2007 : تم تثبيت الموضوع بسوالف سوفت .

10 تعليقات على “الأحداث في الجافا سكريبت events”

جزاك الله خيرا يا اخ خالد ولاكنى اريدك ان تفيدنى لانى اريد تعلم الجافا اسكربت من الصفر

مشكور اخوي
بس عندي استفسار بسيط عن الاشكال الي تطلع بجنب الرسالة يعني مثلا الحين بيطلع لك في الرسالة علامة مثلث اصفر وفيه علامة تعب ! سوداء السوال
كيف اني اقدر اغير الاشكال هاذي ؟

اهي في برمجة الجافا تتغير
JOptionPane.INFORMATION_MESSAGE هذا يعني شكل معلومات

وشكرا لك

السلام عليكم ورحمة الله وبركاته

جزاك الله خير على هذا الدرس المفيد 🙂

مع الأسف مصادر ال JavaScript في الوطن العربي شحيحة جداً

إستمر في عطاءك 🙂

السلام عليكم ورحمة الله وبركاته

موضوع جميل جدا ياحازم الى المزيد دائما ونتمنى المزيد من الدروس القيم سواء فى php او javascript

أستخدام الجافا بشكل كثير عمتاً يؤئي الزائر

ويئذي المبرمج أيضاً وهو يعمل بالمشروع 🙂

ولكن كنت أوضح بأستخدمها فقط ﻷنها معروفة للكل بإذن الله

شكراً على الملاحظة يا تامر

رد

حبيت أضيف انه مع ان دالة ()alert
مفيدة ولكن استعمالها أكتر من الازم يؤدي الي ملل الزائر
معلومة على الطاير كده
ولو عايز تنبه الزائر لحاجة
تستطيع استعمال فكرة الكتابة في الصفحة نتيجة لحدث معين
تحدد لها div فاضية وتكتب فيها اللي انت عايزه
دمتم بعافية

بجد اشكرك بحراره على هذا الموضع لانك افادتنى بجد وكنت اريد اعرف هذه الاشياء اننا نستخدمها ولكن لا نعرف هذه الاكواد على حقيقتها البرمجيه واشكرك مره اخرى لانك اضفت لى اشياء لم اعرفها من قبل فى ال java script
طلب : كن اريد كتاب مترجب بس مستواه عالى فى java script
واشكرك عل هذا الجهد المبزول

اترك رد

هذا الموقع يستخدم Akismet للحدّ من التعليقات المزعجة والغير مرغوبة. تعرّف على كيفية معالجة بيانات تعليقك.