الأحداث في الجافا سكريبت events
السلام عليكم
بعد ساعتين تقريباً من كتابة أكواد JavaScript والأندماج مع الأحداث event - إن صحة التسمية - فأحببت تسجيل بعض منهم.
المقصود بحدث : مثلاً onClick أو ondblclick أو ....
الفائدة من الأحداث : هي تعبر أساس أجراء عمليات الـJavaScript فمثلاً لو أحببنا نظهر رسالة "مرحباً بك أيها الزائر" فسنسنتخدم الدالة alert وهي دالة لها مدخل واحد وهو الرسالة؛.
أين أستخدام الأحداث إذاً؟ سوف أبلغك ... لعرض هذه الرسالة عند بداية تحميل الصفحة فسنستخدم الحدث onLoad في تاج body بالشكل الأتي :- <body onLoad="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 : تم تثبيت الموضوع بسوالف سوفت .