jq项目使用了bootstrap-switch.js插件,发现在禁用时点击两次开关依然会增加一个bootstrap-switch-focused的类名,普通的focus事件无法进入,可用以下方法:
(另外,如果有多个开关,需要获取当前改变的开关,可以在onSwitchChange事件内使用event.target.id获取当前开关的id。)
$(".checkbox-switch").bootstrapSwitch({
onText: "开启", // 设置ON文本
offText: "关闭", // 设置OFF文本
onColor: "success", // 设置ON文本颜色 (info/success/warning/danger/primary)
offColor: "default", // 设置OFF文本颜色 (info/success/warning/danger/primary)
size: "normal", // 设置控件大小,从小到大 (mini/small/normal/large)
handleWidth: "35", //设置控件宽度
//初始化
onInit: function onInit(dom,event,state) {
//禁用时去除focus样式
$('.checkbox-switch').on('focus.bootstrapSwitch',function(){
$('.bootstrap-switch-disabled').removeClass("bootstrap-switch-focused")
})
},
// 当开关状态改变时触发
onSwitchChange: function (event, state) {
var isornotId = event.target.id
console.log('isornotId ',isornotId )
}
})