js 单击 弹出 页面 Model

版权声明：转载请标明出处 https://blog.csdn.net/Joe_Wang1/article/details/81661937

//效果 

// model 

           <%--Model框--%>
            <div class="modal" id="mymodal">

                <div class="modal-dialog">
                    <div class="modal-content" style="margin-right: 250px">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"
                                    aria-hidden="true">×
                            </button>
                            <h4 class="modal-title" id="myModalLabel">
                                添加角色
                            </h4>
                        </div>

                        <div class="container">
                            <div class="row clearfix">
                                <div class="col-md-12 column">
                                    <form role="form">
                                        <div class="form-group" style="width: 300px">
                                            <label for="exampleInputpermissionName">角色名称</label><input type="text"
                                                                                                       class="form-control"
                                                                                                       id="exampleInputpermissionName"
                                                                                                       placeholder="请输入角色名称"/>
                                        </div>
                                        <div class="form-group" style="width: 300px">
                                            <label for="exampleInputurl">角色类型</label><input type="url"
                                                                                            class="form-control"
                                                                                            id="exampleInputurl"
                                                                                            placeholder="请输入角色类型"/>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-default"
                                    data-dismiss="modal">关闭
                            </button>
                            <button type="button" class="btn btn-primary">
                                提交更改
                            </button>
                        </div>
                    </div><!-- /.modal-content -->
                </div><!-- /.modal-dialog -->
            </div><!-- /.modal -->

            <%--Model框--%>

 //js

$(function () {
    console.log('rolelist.js');
$('#rolelist').on('click','.addRole',addRole)
});
/**
 * 弹出Model
 */

function addRole() {

    $("#mymodal").modal().show();




}