آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

مرجع کار با Js Button در Bootstrap 4

دوره های مرتبط با این مقاله

مرجع کار با Java Script Button در Bootstrap 4:

در این درس به آموزش کار با کلاس، خواص و متدهای Js Button در Bootstrap 4 خواهیم پرداخت. همانطور که می دانید از Button در جاوا اسکریپت برای ایجاد دکمه و لینک استفاده می شود.

آموزش کلاس های Js Button در بوت استرپ 4 :

جدول زیر، کلیه کلاس های کار با Js Button در بوت استرپ 4 را با توضیح، ارائه کرده است.

این کلاس ها را می توانید برای استایل دهی به تگ های <a>، <button> و <input> به کار ببرید :

برای دریافت اطلاعات کامل درباره دکمه های بوت استرپ، به بخش آموزش دکمه ها Buttons در Bootstrap 4 سایت تحلیل داده بروید.

کلاس
توضیحات
کلاس btn
استایل پایه بوت استرپ 4 را به هر دکمه ای اعمال می کند.
کلاس btn-block
این کلاس، دکمه را به صورت block (تمام عرض در صفحه یا عنصر مادر آن)، در می آورد.
کلاس btn-danger
یک دکمه را با رنگ قرمز نشان می دهد که معمولا برای اعلان خطر یا عمل منفی به کاربر استفاده می شود.
کلاس btn-dark
یک دکمه با رنگ خاکستری تیره ایجاد می کند.
کلاس btn-default
یک دکمه پیش فرض، با استایل استاندارد Bootstrap 4 ایجاد می کند.
کلاس btn-info
یک دکمه با رنگ سبز متمایل به آبی ایجاد می کند که معمولا برای نمایش اطلاعات به کاربر استفاده می شود.
کلاس btn-lg
یک دکمه با اندازه بزرگ Large ایجاد می کند.
کلاس btn-light
یک دکمه با رنگ خاکستری بسیار کم رنگ ایجاد می کند.
کلاس btn-link
یک دکمه را به صورت link در می آورد (ولی همچنان به صورت دکمه عمل می کند).
کلاس btn-outline-*
یک دکمه را با پس زمینه سفید، ولی خطوط حاشیه رنگی ایجاد می کند که متن آن نیز با رنگ حاشیه یکی است (به جای * می توانید از کلاس های رنگی ویژه بوت استرپ 4، استفاده کنید تا رنگ دکمه تعیین شود مثل btn-outline-info و btn-outline-dark و ...).
کلاس btn-promary
یک دکمه را با پس زمینه آبی ایجاد می کند که معمولا به عنوان دکمه استاندارد صفحات به کار می رود.
کلاس btn-sm
یک دکمه با سایز کوچک Small، ایجاد می کند.
کلاس btn-success
یک دکمه با رنگ سفید ایجاد می کند که معمولا برای نمایش موفقیت یا عملیات مثبت به کاربر استفاده می شود.
کلاس btn-secondary
یک دکمه با پس زمینه تیره ایجاد می کند که معمولا برای نمایش اطلاعات کم اهمیت مناسب است.
کلاس btn-toolbar
چندین کنترل را با هم ترکیب کرده تا یک گروه از دکمه مثلا برای صفحه بندی صفحه یا ساخت toolbar ایجاد نماید.
کلاس btn-warning
یک دکمه با پس زمینه زرد رنگ درست می کند که معمولا برای نمایش اخطار یا جلب توجه کاربر جهت انجام عملیات احتیاطی کاربرد دارد.
کلاس active
این کلاس، دکمه را به صورت فعال (انگار که فشار داده شده یا کلیک شده)، نشان می دهد.
کلاس disable
دکمه را به صورت غیر فعال (غیر قابل کلیک شدن) یا disable در می آورد.

آموزش کار با دکمه Button در جاوا اسکریپت

به وسیله کد زیر، می توانید با یک دکمه (Button) در جاوا اسکریپت کار نمایید :

$('.btn').button();
            

آموزش کار با متدها (Methods) دکمه در Bootstrap 4 :

در جدول زیر، کلیه متدهای کار با دکمه در جاوا اسکریپت و بوت استرپ را به همراه توضیح، نشان داده ایم :

متد
توضیحات
متد button (“toggle”)
این متد کاری می کند که انگار دکمه کلیک شده یا فشرده شده است.
متد button (“dispose”)
این متد، یک دکمه یا Button موجود را نابود می کند.
نکته :

متدهای فوق را در یک دکمه، می توانید از طریق خواص data attributes اضافه کنید. برای این منظور، بایستی نام متد را به خاصیت data بچسبانید، مثل data-toggle یا data-dispose.

  • 59
  •    46
  • تاریخ ارسال :   1398/08/21

دانلود PDF دانشجویان گرامی اگر این مطلب برای شما مفید بود لطفا ما را در GooglePlus محبوب کنید
رمز عبور: tahlildadeh.com یا www.tahlildadeh.com
ارسال دیدگاه نظرات کاربران
شماره موبایل دیدگاه
عنوان پست الکترونیک

ارسال

آموزشگاه برنامه نویسی تحلیل داده
آموزشگاه برنامه نویسی تحلیل داده

تمامی حقوق این سایت متعلق به آموزشگاه تحلیل داده می باشد .