logo

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





10-07-2021 04:08 مساءً
معلومات الكاتب ▼
تاريخ الإنضمام : 15-01-2020
رقم العضوية : 1
المشاركات : 2235
الدولة : فلسطين
الجنس :
تاريخ الميلاد : 11-9-1998
الدعوات : 18
قوة السمعة : 440
موقعي : زيارة موقعي

بسم الله الرحمن الرحيم

شرح الدالة change
درسنا اليوم يتحدث عن دالة change
وعمل هذه الدالة هي انها تقوم بعرض حدث ما عند تغيير حالة العنصر واكثر عملها على النماذج والحقول
طريقة كتابة الدالة بهذا الشكل:
CODE
$(element).change(function() {<br />
&nbsp;<br />
&nbsp; });<br />
<br />


بداية ً لابد من اسناد العنصر الذي سوف تعمل عليه الدالة والمرموز له في الكود السابق بــ element
ومن ثم نقوم بادراج الاحداث التي نريد عملها داخل اقواس الدالة
لنأخذ مثال لكي تتضح الصورة اكثر ونبسطها بشكل اكبر





فلنفرض ان لدينا نموذج تسجيل اعضاء ويحمل هذا النموذج حقلين اختيار من نوع checkbox تشير الى حالة العضو العائلية

الخيار الاول: اعزب
الخيار الثاني: متزوج

ونريد عندما يقوم العضو باختيار الخيار متزوج ان تظهر له رسالة تسأله عن عدد الابناء وعند اختياره الخيار أعزب تختفي هذه الرسالة
سوف يكون كود html بهذا الشكل
CODE
<label class="btn btn-primary ">
                    متزوج
                    <input type="radio" name="show_change_msg" id="show_change_msg" >
                </label>
                <label class="btn btn-primary active">
                    أعزب
                    <input type="radio" name="show_change_msg" id="hide_change_msg" >
                </label>

<div id="container" style="display: none;">
                    <h3>
                        كم عدد الابناء
                    </h3>
                </div>



وكود ال jquery بهذا الشكل

CODE
$(function() {
    $('#show_change_msg').change(function() {
        $('#container').slideDown("3000");
    });
    $('#hide_change_msg').change(function() {
        $('#container').hide("3000");
    });

});



لنشرح الكود قمنا اولا ً باسناد العنصر الخاص بخيار المتزوج الى الدالة change والذي يحمل اسم show_change_msg
ثم قمنا باستخدام دالة slideDown والتي قمنا بشرحها في الدروس السابقة لكي تقوم باظهار رسالة كم عدد الابناء
ومن ثم قمنا باستخدام الدالة مرة أخرى بنفس الطريقة لاخفاء الرسالة عند اختيار الخيار أعزب وكما تلاحظون قمنا هنا باستخدام الدالة hide

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


اضافة رد جديد اضافة موضوع جديد



المواضيع المتشابهه
عنوان الموضوع الكاتب الردود الزوار آخر رد
| .:: شرح ::. | اضافة منتديات الفرعية ب شكل جميل | للاستايل هيلبرنت الاخضر مهدي حميد
4 1667 عمار
شرح انشاء منتدى VB 3.8.9 وتعريبه بالفيديو Admin
26 3544 نور
شرح كود تعطيل مانع الإعلانات في بلوجر Admin
0 319 Admin
مورينيو يشرح الخطة التي جعلته يتفوق على برشلونه في مواجهاتهم عام 2010 Basil Abdallah
0 92 Basil Abdallah
المصباح المنير في غريب الشرح الكبير للرافعي....... الجــــ 2ـــــــزء Basil Abdallah
0 110 Basil Abdallah

الكلمات الدلالية
شرح ، الدالة ، change ،









الساعة الآن 08:40 PM