Bootstrap 开关(switch)控件

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");
                    }
                }
            });
        });

 

 

 

NameAttributeTypeDescriptionValuesDefault
statecheckedBooleanThe checkbox statetrue, falsetrue
sizedata-sizeStringThe checkbox sizenull, 'mini', 'small', 'normal', 'large'null
animatedata-animateBooleanAnimate the switchtrue, falsetrue
disableddisabledBooleanDisable statetrue, falsefalse
readonlyreadonlyBooleanReadonly statetrue, falsefalse
indeterminatedata-indeterminateBooleanIndeterminate statetrue, falsefalse
inversedata-inverseBooleanInverse switch directiontrue, falsefalse
radioAllOffdata-radio-all-offBooleanAllow this radio button to be unchecked by the usertrue, falsefalse
onColordata-on-colorStringColor of the left side of the switch'primary', 'info', 'success', 'warning', 'danger', 'default''primary'
offColordata-off-colorStringColor of the right side of the switch'primary', 'info', 'success', 'warning', 'danger', 'default''default'
onTextdata-on-textStringText of the left side of the switchString'ON'
offTextdata-off-textStringText of the right side of the switchString'OFF'
labelTextdata-label-textStringText of the center handle of the switchString' '
handleWidthdata-handle-widthString | NumberWidth of the left and right sides in pixels'auto' or Number'auto'
labelWidthdata-label-widthString | NumberWidth of the center handle in pixels'auto' or Number'auto'
baseClassdata-base-classStringGlobal class prefixString'bootstrap-switch'
wrapperClassdata-wrapper-classString | ArrayContainer element class(es)String | Array'wrapper'
onInit FunctionCallback function to execute on initializationFunction
function(event, state) {}
onSwitchChange FunctionCallback function to execute on switch state change. If false is returned, the status will be reverted, otherwise nothing changesFunction
function(event, state) {}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值