Bootstrap switch 开关事件处理

    需要使用Bootstrap switch,实现通过、拒绝功能并且在开关至拒绝时,显示textarea框输入原因。

    1、css引用
    <link href="switch/css/bootstrap-switch.min.css" rel="stylesheet">

    2、js引用
    <script src="switch/js/bootstrap-switch.min.js"></script>

    3、页面(使用modal打开,若须使用需引用对应的js和css)

     <div class="col-lg-1">
            <a id="" class="btn btn-danger btn-facebook animation_select" data-toggle="modal" data-target="#approve_modal">审批</a>
    </div>

        <!--审批modal-->
        <div class="modal inmodal" id="approve_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog">
                            <div class="modal-content animated bounceInRight">
                                        <div class="modal-header">
                                                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
                                                    <h1 class="modal-title">审 批</h1>
                                                    <br>
                                                    <input type="checkbox" name="my-checkbox" id="my-checkbox">
                                                </div>
                                                <div class="modal-body">
                                                    <div class="form-group animated fadeIn" id="approve_input" style="display:none;"><label style="font-size: 15px;">若不通过,请说明原因:</label> <textarea id="approve_area" rows="5" placeholder="填写内容请控制在250字以内。" class="form-control" maxlength="250">

猜你喜欢

转载自blog.51cto.com/bilibili/2133343