النتائج 1 إلى 14 من 14

الموضوع: الأحداث في الجافا سكريبت events

  1. #1
    عضو نشيط جدا
    تاريخ التسجيل
    Apr 2004
    المشاركات
    431

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



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

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

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

    أين أستخدام الأحداث إذاً
    سوف أبلغك … لعرض هذه الرسالة عند بداية تحميل الصفحة فسنستخدم الحدث onLoad في تاج body بالشكل الأتي :
    كود:
    <body onLoad="alert('مرحباً بك')">
    اما لعرضه عند الضغط على زر أرسال مثلاً
    كود:
    <a href="delete_record.php" onClick="return confirm('متأكد ؟')">Delete</a>
    بعض الأحداث وفائدتها
    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('سيتم تصفير الفورم')" onSubmit="alert('شكراً مقدماً لتجيلك بالموقع :D')">
    onSelect : تستخدم مع التاجات(Input و TextArea) وهي تنفز عند التعليم على الكلام بداخل أحد التاجين
    onChange : وتستخدم عادتاً مع القوائم المنسدلة (Select) ولكن يمكن أستخدامها أيضاً مع (input type=text و textarea)
    مثال بسيط
    كود:
    <input type="text" onchange="this.value = this.value.toUpperCase()" />
    وأخيراً يارب أكون أفدت
    مدونة حازم خالد





    __________________
    حازم خالد
    مبرمج، بعمل مواقع ويب وتطبيقات موبيل، هتلاقي شوية كورسات فيديو على YouTube بتاعي، وشوية كود على اكونت Github، ودي سيرتي فيها شوية حجات من شغلي، اخيراً كل لينكات السوشيال ميديا بتاعتي هنا.


  2. #2
    خبير JavaScript
    تاريخ التسجيل
    Jul 2002
    المشاركات
    2,920


    درس مميز أخي في شرح أحداث الجافا سكريبت
    في درسك هذا طرحت طريق تعامل الأحداث من خلال الوسم، ك
    كود HTML:
    <body onLoad="alert('مرحباً بك')">
    و
    كود HTML:
    <img src="image.gif" onerror="alert('The im
    لكن يمكن أيضا التحكم في تلك الوسوم ووضع أحداث لها من خلال كود بالجافاسكريبت دون وضعها في الوسم نفسه، يكفي أن نضع له تعريفة مسبقة حتى تتم لنا سيطرة مطلقة على الوسم، فمثلا هذا الحدث
    كود HTML:
    <body onLoad="alert('مرحباً بك')">
    ممكن أن نصل اله من خلال الكود دون ان نكتبه في الوسم عن طريق
    كود PHP:
    window.onload = function(){alert('مرحباً بك')} 
    و
    كود HTML:
    <img src="image.gif" onerror="alert('The image could not be loaded.')" />
    كود PHP:
    document.getElementById("id_image").onerreur = function(){
        
    alert('The image could not be loaded.')

    لكن لا ننسى أن نعطي نفس التعريفة id_image جافاسكريبت خارجي
    كود HTML:
    <img src="image.gif" id="id_image" />
    فهو المقبض الذي يجعلنا نتحكم في الوسم من خلال كود
    كود PHP:
    document.getElementById("id").onclick = function(){alert("test")}
    document.getElementById("id").ondbclick = function(){alert("test")}
    document.getElementById("id").onsubmit = function(){alert("test")}
    document.getElementById("id").onmouseover = function(){alert("test")}
    .... 
    _______________






  3. #3
    عضو نشيط جدا
    تاريخ التسجيل
    Apr 2004
    المشاركات
    431


    شكراً لك أستاذ Zizwar وطبعاً أضافاتك مميزة

    أستأذنك بأضافتها في المقال بمدونتي

    شكراً لعى التثبيت





    التعديل الأخير تم بواسطة mezoo ; 21-03-2007 الساعة 07:05 AM سبب آخر: لاحظت التثبيت
    __________________
    حازم خالد
    مبرمج، بعمل مواقع ويب وتطبيقات موبيل، هتلاقي شوية كورسات فيديو على YouTube بتاعي، وشوية كود على اكونت Github، ودي سيرتي فيها شوية حجات من شغلي، اخيراً كل لينكات السوشيال ميديا بتاعتي هنا.

  4. #4
    خبير JavaScript
    تاريخ التسجيل
    Jul 2002
    المشاركات
    2,920


    اقتباس المشاركة الأصلية كتبت بواسطة mezoo
    شكراً لك أستاذ Zizwar وطبعاً أضافاتك مميزة

    أستأذنك بأضافتها في المقال بمدونتي

    شكراً لعى التثبيت
    التثبيت أقل ما يستحقه موضوعك






  5. #5
    عضو نشيط جدا
    تاريخ التسجيل
    Apr 2004
    المشاركات
    431


    هذا من ذوقك





    __________________
    حازم خالد
    مبرمج، بعمل مواقع ويب وتطبيقات موبيل، هتلاقي شوية كورسات فيديو على YouTube بتاعي، وشوية كود على اكونت Github، ودي سيرتي فيها شوية حجات من شغلي، اخيراً كل لينكات السوشيال ميديا بتاعتي هنا.



  6. مميزين جدا
    بارك الله فيكم ووفقكم

    جدا مميز الشرح واضح ولا أروع

    يعطيكم العافية

    السلام عليكم





    __________________
    كل مالا يعطى يضيع

  7. #7
    عضو فعال
    تاريخ التسجيل
    Nov 2005
    المشاركات
    1,390


    جزاكم الله خيرا
    درس جميل ومميز





    __________________
    اللهم أنت ربي لا إله الا أنت،
    خلقتني وأنا عبدك وأنا على عهدك ووعدك ما استطعت،
    أعوذ بك من شر ما صنعت،
    أبوء لك بنعمتك عليّ وأبوء بذنبي،
    فاغفر لي، فإنه لا يغفر الذنوب إلا أنت

  8. #8
    عضو جديد
    تاريخ التسجيل
    May 2006
    المشاركات
    15

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



    جزاك الله خيراً
    بجد موضع رائع ويستحق التثبيت وفى أنتظار المزيد







    __________________
    Eng.: Adel Samy.
    E-mail : info@speedmaximum.com
    .E-mail : adel.samy.dev@gmail.com.
    Web - Site : www.speedmaximum.com.
    Mob. : 0020126865595.
    Title : PHP Developer.

  9. #9
    عضو فعال
    تاريخ التسجيل
    May 2004
    المشاركات
    1,591


    موضوع رائع مشكووور اخوي ...





    __________________
    دروس php بالفيديو !

    marabe7 سابقاً .

    حسَّن موقعك في محركات البحث :
    أكاديمية التطوير

  10. #10
    عضو نشيط
    تاريخ التسجيل
    Sep 2006
    المشاركات
    53


    درس رائع اخ mezoo
    وأخ zizwar تعليقك اروع
    بس اذا في مجال تزودو دروس
    شكرا لكم
    نزيد دروس للفائده http://www.javascriptkit.com/javatutors/





    __________________
    العقول الكبيرة لها اهداف,,,, أما الاخرى فلها الاماني
    Arabnewz قادم بحله جديده.....سوف يتم تحويله الى CMS
    باذن الله

  11. #11
    عضو نشيط
    تاريخ التسجيل
    Sep 2006
    المشاركات
    72


    طيب لو أبي استعدي ملف جافا عند الضغط على الزر كيف بيكون الكود ؟؟؟






  12. #12
    خبير JavaScript
    تاريخ التسجيل
    Jul 2002
    المشاركات
    2,920


    اقتباس المشاركة الأصلية كتبت بواسطة الطائر الحر
    طيب لو أبي استعدي ملف جافا عند الضغط على الزر كيف بيكون الكود ؟؟؟
    لم أفهم كلمة استعدي






  13. #13


    اقتباس المشاركة الأصلية كتبت بواسطة Zizwar
    لم أفهم كلمة استعدي
    يقصد استدعي :nice:





    __________________
    تابعني على Twitter

  14. #14
    خبير JavaScript
    تاريخ التسجيل
    Jul 2002
    المشاركات
    2,920





ضوابط المشاركة

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك
  •  

أضف موقعك هنا| اخبار السيارات | حراج | شقق للايجار في الكويت | بيوت للبيع في الكويت | دليل الكويت العقاري | مقروء | شركة كشف تسربات المياه | شركة عزل اسطح بالرياض | عزل فوم بالرياض| عزل اسطح بالرياض | كشف تسربات المياة بالرياض | شركة عزل اسطح بالرياض