bootstrap模态框

最新推荐文章于 2024-04-23 03:20:59 发布

coder-zm

最新推荐文章于 2024-04-23 03:20:59 发布

阅读量263

点赞数

分类专栏： js 文章标签： bootstrap html js

本文链接：https://blog.csdn.net/qq_27255679/article/details/78839703

版权

js 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

模态框部分html代码：

<div class="modal fade" id="wgComModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    ×
                </button>
                <h4 class="modal-title" id="wgComModalLabel">
                    动态替换内容
                </h4>
            </div>
            <div class="modal-body" id="wgComMain">
                数据努力的加载中......
            </div>
        </div>
    </div>
</div>

js通用调用方法：

//打开模态框 并赋值标题
    function openCommonModal(modalTitle) {
        $("#wgComModal").modal({
            keyboard: false, backdrop: 'static', show: true
        });
        //赋值模态框标题
        $("#wgComModalLabel").empty().append(modalTitle);
    }

请求controller，返回页面信息。并在js追加

function getModel(param) {
        openCommonModal(modalTitle);
        $.post("queryUrl", param,
            function (data) {
                $("#wgComMain").empty().html(data);
            });
    }