Bootstrap 开关(switch)控件
http://www.bootcss.com/p/bootstrap-switch/
https://github.com/Bttstrp/bootstrap-switch
$(function(){ $("#mySwitch").bootstrapSwitch({ state:true, size:'large', onColor:'success', offColor:'danger', onText:'开', offText:'关', onSwitchChange:function(event, state){ if(state==true){ var id = $(this).attr("id"); console.log(id); console.log("true"); }else{ console.log("false"); } } }); });
Name | Attribute | Type | Description | Values | Default |
state | checked | Boolean | The checkbox state | true, false | true |
size | data-size | String | The checkbox size | null, 'mini', 'small', 'normal', 'large' | null |
animate | data-animate | Boolean | Animate the switch | true, false | true |
disabled | disabled | Boolean | Disable state | true, false | false |
readonly | readonly | Boolean | Readonly state | true, false | false |
indeterminate | data-indeterminate | Boolean | Indeterminate state | true, false | false |
inverse | data-inverse | Boolean | Inverse switch direction | true, false | false |
radioAllOff | data-radio-all-off | Boolean | Allow this radio button to be unchecked by the user | true, false | false |
onColor | data-on-color | String | Color of the left side of the switch | 'primary', 'info', 'success', 'warning', 'danger', 'default' | 'primary' |
offColor | data-off-color | String | Color of the right side of the switch | 'primary', 'info', 'success', 'warning', 'danger', 'default' | 'default' |
onText | data-on-text | String | Text of the left side of the switch | String | 'ON' |
offText | data-off-text | String | Text of the right side of the switch | String | 'OFF' |
labelText | data-label-text | String | Text of the center handle of the switch | String | ' ' |
handleWidth | data-handle-width | String | Number | Width of the left and right sides in pixels | 'auto' or Number | 'auto' |
labelWidth | data-label-width | String | Number | Width of the center handle in pixels | 'auto' or Number | 'auto' |
baseClass | data-base-class | String | Global class prefix | String | 'bootstrap-switch' |
wrapperClass | data-wrapper-class | String | Array | Container element class(es) | String | Array | 'wrapper' |
onInit | Function | Callback function to execute on initialization | Function | | |
onSwitchChange | Function | Callback function to execute on switch state change. If false is returned, the status will be reverted, otherwise nothing changes | Function | |