项目中引用adminLTE前端框架,弹出页面是模态框方法, 下面是某个detail.html文件
<div class="modal fade" id="viewDialog" role="viewDialog" aria-hidden="true">
<div class="modal-dialog modal-full">
<div class="modal-content">
<div class="modal-header" style="padding:10px !important;padding-bottom:5px;border-bottom:0px !important;">
<input type="button" value="上一张" onClick="javascript:maskprev(this)" style="margin-left:185px;">
<input type="button" value="下一张" onClick="javascript:masknext(this)" style="margin-left:60px;">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
</div>
<div class="modal-body mask-layer-imgbox" style="padding-top:0px;text-align:center;"><!-- height:480px;width:600px -->
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
点击某个按钮或链接,弹出模态框
<a data-toggle="modal" onClick="javascript:viewFile()" href="#" data-target="#viewDialog">派遣</a>
<script>
function viewFile() {
$('#viewDialog').modal({
backdrop:"static",
keyboard:false,
show: true
});
}
</script>
js弹出模态框还有一种写法
function showPage() {
$('#viewDialog').off().on('shown.bs.modal', function(){
//...处理一些前台传值等
});
}
展示效果如下 :