借助jqueryUI 的Dialog 在隐藏的div中嵌入Iframe 改变iframe的路径
如果项目经常用到弹出新窗体,则利用模板,把此代码和html 放入父页面中,实现父级调用,
<input type="button" value="弹出" id="btn" />
<div id="dialog-confirm" style="display: none;overflow: hidden;">
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" id="prodcutDetailSrc" scrolling="no" width="100%" height="100%"></iframe>
</div>
$(function () {
// 初始化
$("#btn").click(function () {
// alert("btn 被点击啦!");
//$("#dialog-confirm").dialog("open");
// 初始化对话框
$("#dialog-confirm").dialog(
{
modal: true, // 创建模式对话框
autoOpen: true,//是否自动打开
height: 400, //高度
width: 626, //宽度
title: "新窗体",
title_html: true,
buttons: {
"Ok": function () {
$("#deleteBtn").click();
$(this).dialog('close');
},
"Cancel": function () { $(this).dialog('close'); return false; }
}
}
);
})
;
$("#prodcutDetailSrc").attr("src", "/Home/About"); //设置IFRAME的SRC;
});
参照https://www.cnblogs.com/kmsfan/p/4119788.html
http://www.runoob.com/jqueryui/example-dialog.html