前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >bug之bootstrap switch Uncaught TypeError: Cannot read property 'apply' of undefined

bug之bootstrap switch Uncaught TypeError: Cannot read property 'apply' of undefined

作者头像
用户5640963
发布2019-07-25 11:32:41
1.4K0
发布2019-07-25 11:32:41
举报
文章被收录于专栏:卯金刀GG卯金刀GG

<input type="checkbox" name="my-switch" checked>

js写以下代码,不然switch控件出不来

$("[name='my-switch']").bootstrapSwitch();

$('[name="my-switch"]').bootstrapSwitch({

onText:"启动",

offText:"停止",

onColor:"success",

offColor:"info",

size:"small",

onSwitchChange:function(event,state){

if(state==true){

$(this).val("1");

}else{

$(this).val("2");

}

}

})

上述方法,没有亲测,大家可以试一试!

代码语言:javascript
复制
<div class="make-switch" data-on-label="开" data-off-label="关" id="toggle-state-switch" data-on="success" data-off="warning">
    <input id ="toggle" type="checkbox"  checked="checked" class="toggle"  />
</div>

function changeState(stateValue){
        if(stateValue==1){
            $('#toggle-state-switch').bootstrapSwitch('setState', true);
        }else{
            $('#toggle-state-switch').bootstrapSwitch('setState', false);
        }
}

使用上述的方法

$('#toggle-state-switch').bootstrapSwitch('setState', false); 是有问题的。

应该使用

$('#toggle-state-switch').bootstrapSwitch('state', true/false);

还有一个坑,就是在使用外面的div的id设置bootstrapSwitch的state,会多了节点,如下:

这并不是我们想要的结果,所以,设置外置div的值是不对的。应该取checkbox的id设置,也就是,如下:

$('#toggle').bootstrapSwitch('state', false);

对bootstrap switch进行赋值的时候,提示错误 Uncaught TypeError: Cannot read property 'apply' of undefined

代码语言:javascript
复制
        if (isUp==undefined || isUp == ''){
            $('#isUp').bootstrapSwitch('setState',true);
        } else{
            $('#isUp').bootstrapSwitch('setState',isUp);
        }

详细错误信息如下图所示:

1
1

我参考这个设置 使用jQuery获取Bootstrap Switch的值 看来有问题,于是查看源码,根本没有setState方法,应该使用下面的方法:

代码语言:javascript
复制
if(stateValue==0){
            $('#toggle').bootstrapSwitch('state', true);
            console.log("是否启用的状态1:",stateValue);
        }else{
            console.log("是否启用的状态2:",stateValue);
            $('#toggle').bootstrapSwitch('state', false);
        }
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档