يتم تقديم زر في الفصل الزر bootstrap. باستخدام المكون الإضافي للزر ، يمكنك إضافة بعض التفاعلات ، مثل التحكم في حالة الزر ، أو إنشاء مجموعات الأزرار لمكونات أخرى مثل أشرطة الأدوات.
إذا كنت ترغب في الرجوع إلى وظيفة المكون الإضافي بشكل منفصل ، فأنت بحاجة إلى الرجوع إلى الزر. أو ، كما هو مذكور في الفصل الإضافي في Bootstrap ، يمكنك الرجوع إلى bootstrap.js أو إصدارات مضغوطة من bootstrap.min.js.
1. حالة التحميل
لإضافة حالة تحميل إلى الزر ، ما عليك سوى إضافة text-text = "تحميل ..." إلى عنصر الزر كسمات ، كما هو موضح في المثال التالي:
<button id = "fat-btn" data-load-text = "loading ..." type = "button"> loading status </button> <script> $ (function () {$ (". btn"). click (function () }) ؛ }) ؛ </script>2. مفتاح واحد
لتنشيط مفتاح زر واحد (على سبيل المثال ، لتغيير الحالة العادية للزر إلى الحالة الصحفية ، والعكس بالعكس) ، ما عليك سوى إضافة بيانات toggle = "الزر" إلى عنصر الزر كسماته ، كما هو موضح في المثال التالي:
انسخ الرمز كما يلي: <button data-toggle = "button" Autocomplete = "Off"> مفتاح واحد </button>
ملاحظة: عند تحميل صفحة Firefox عدة مرات ، قد يحافظ الزر على تعطيل النموذج أو تحديده. الحل هو: إضافة إكمال تلقائي = "OFF".
3. أزرار الراديو
وبالمثل ، يمكنك إنشاء مجموعة زر الراديو وإضافة تبديل لمجموعة زر الراديو عن طريق إضافة بيانات بيانات البيانات toggle = "الأزرار" إلى مجموعة BTN-Group.
<div data-toggle = "buttons"> <label for = ""> <input type = "radio" name = "sex" autoComplete = "Off" sected> male </sable> <label for = ""
4. تحقق من زر
يمكنك إنشاء مجموعة مربع الاختيار وإضافة تبديل إلى مجموعة مربع الاختيار عن طريق إضافة بيانات بيانات البيانات toggle = "الأزرار" إلى مجموعة BTN-Group.
<div data-toggle = "buttons"> <label for = ""> <input type = "checkbox" name = "fa" autocomplete = "off" checked> music </sably> <label for = "" <label for = ""> <input type = "checkbox" name = "fa" autocomplete = "Off"> الكمبيوتر </label> </viv>
هناك ثلاث معلمات في طريقة الزر في المكون الإضافي للزر: التبديل ، إعادة تعيين ، وسلسلة (مثل التحميل ، كاملة).
// يمكن أن تحل محل toggle = "زر" $ ('button'). على ('click' ، function () {$ (this) .button ('Toggle') ؛})فيما يلي بعض الطرق المفيدة في ملحقات الأزرار:
ما سبق هو كل محتوى هذه المقالة. آمل أن يكون ذلك مفيدًا لتعلم الجميع. لمزيد من المعلومات حول bootstrap ، يرجى الرجوع إلى الموضوع: التعلم التعليمي التعلم bootstrap