button简单的实例:
html文件中:
<div id="buttonset">
<button id="add">添加</button>
<button id="delete">删除</button>
</div>
js文件中:
$("#buttonset").buttonset();
jQuery官方网站上,有这么一段话:
In order to group radio buttons, Button also provides an additional widget, called Buttonset. Buttonset is used by selecting a container element (which contains the radio buttons) and calling .buttonset(). Buttonset will also provide visual grouping, and therefore should be used whenever you have a group of buttons. It works by selecting all descendants and applying .button() to them. You can enable and disable a button set, which will enable and disable all contained buttons.
大意就是buttonset根据一个元素的子元素来生成一组buttons或者一组radios,它的工作原理是通过选择所有子孙并使用它们的.button()方法
一些button的配置:
- disabled:为true时使得按钮无效,默认为false
- icons:为按钮设定图标,参数为一个Object,t,包含primary和secondary,默认为{ primary: null, secondary: null }:
- jQuery UI提供了很多小的图标,这里可以直接通过图标的名字来选择图标,primary出现在按钮最左端,而secondary出现在按钮的最右端,比如一个简单的设置:
- $( "#someButton" ).button({ icons: { primary: "ui-icon-gear", secondary: "ui-icon-triangle-1-s" } });
- 这个设置会使得按钮左端出现一个小的齿轮而按钮右端出现一个向下的小箭头
- jQuery UI提供了很多小的图标,这里可以直接通过图标的名字来选择图标,primary出现在按钮最左端,而secondary出现在按钮的最右端,比如一个简单的设置:
- label:按钮上显示的问题,默认为null,可以是HTML的内容,比如插入图片
- text:判断是否显示label的内容,当设定为false的时候,仅仅icons会显示,但如果icons配置未被设置,text的设置将会无效,默认为true
button也有一些方法,不过与accordion的方法类似,就不赘述了