عزیزان با آموزش JqueryUI Button درخدمت شما دوستان هستیم . همانطورکه میدانید دکمه ها برای هر گرافیک و طراحی مورد نیاز میباشد .پس در این بخش نیز مطلبی رو برای شما اماده کردیم .
JqueryUI – Button
jQueryUI متد button() را ارائه می دهد برای تبدیل عناصر HTML (مانند دکمه ها، ورودی ها و anchorها) به دکمه های دارای موضوع (themeable)، با تنظیم حرکات ماوس روی آنها، ارائه می دهد، که همه به طور واضحی توسط jQuery UI تنظیم شده اند.
برای گروه بندی دکمه های رادیو، Button همچنین یک ویجت اضافه به نام Buttonset ارائه می دهد. Buttonset با انتخاب یک حامل عنصر ( که حاوی دکمه های رادیو است) و فراخوانی متد buttonset() استفاده می شود.
ترکیب:
متد button() می تواند به دو شکل زیر استفاده می شود:
$(selector, context).button (options) Method
$(selector, context).button (“action”, params) Method
متد $(selector, context).button (options):
متد button (options) اعلام می کند که یک عنصر HTML باید مانند یک دکمه در نظر گرفته شود. پارامتر options آبجکتی است که رفتار و ظاهر دکمه را تعیین می کند.
$(selector, context).button (options);
شما می توانید با استفاده از آبجکت Javascript یک یا چند گزینه را همزمان ارائه دهید. اگر بیشتر از یک گزینه وجود داشته باشد، می توانید آنها را با استفاده از کاما از یکدیگر جدا کنید، مانند ترکیب زیر:
$(selector, context).button({option1: value1, option2: value2….. });
جدول زیر لیست های option های مختلف را ارائه می دهد که با این متد مورد استفاده قرار می گیرند:
Option
Description
disabled
این گزینه دکمه ی تنظیم شده روی true را غیرفعال می سازد. مقدار پیش فرض آن false است.
icons
این گزینه تعیین می کند که یک یا دو آیکن در button نمایش داده شوند: آیکن های اولیه در سمت چپ و آیکن های ثانویه در سمت راست. آیکن اولیه با پراپرتی primary و آیکن ثانویه با پراپرتی secondary تشخیص داده می شود. مقدار پیش فرض آن primary: null, secondary: null می باشد.
label
این گزینه متنی را برای نمایش روی دکمه تعیین می کند که برچسب معمول را رد می کند. اگر حذف شود، برچسب معمول نمایش داده می شود. در مورد دکمه های radio و چک باکس ها، برچسب معمول است که با کنترل در ارتباط است. مقدار پیش فرض آن null است.
text
این گزینه تعیین می کند که آیا متن روی دکمه نمایش داده شود. اگر به عنوان false تعیین شده باشد، متن حذف می شود، اگر (و فقط اگر) گزینه ی icons حداقل یک آیکن را تعیین کنند. مقدار پیش فرض آن true است.
قابلیت پیش فرض:
مثال زیر قابلیت دکمه ی ویجت را توضیح می دهد، که هیچ پارامتری به متد button() منتقل نمی شود.
$(function () {
$(“#button-1, #button-2, #button-3, #button-4”).button();
$(“#button-5”).buttonset();
});