<!DOCTYPE html>
<html>
    <head>

    </head>
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
    <link href="https://unpkg.com/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css" rel="stylesheet">
    <script type="text/javascript"  src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://unpkg.com/bootstrap-switch"></script>
 
    <body>
            <input type="checkbox" data-value="id" class="switch" />    data-on-text="open"
             ontext offtext
              size   null, 'mini', 'small', 'normal', 'large'
              onColor offColor    'primary', 'info', 'success', 'warning', 'danger', 'default'
    </body>

    <script stype="javascript/text">

        $(".switch").bootstrapSwitch({
             onText: "Open",           
             offText: "Close",           
             onColor: "success",    
            offColor: "primary",
            onSwitchChange: function(event, state) {
                console.log(this); // DOM element
                console.log(event); // jQuery event
                console.log(state); // true | false
                console.log($(this).data('value'));
                state=false;
            }
        });
        $(".switch").bootstrapSwitch("size" ,"large").bootstrapSwitch('state',true);
</script>
    
</html>

 

posted on 2019-05-16 16:40  Aaron_Net  阅读(734)  评论(0编辑  收藏  举报