在网页执行之前创建强制选择弹出窗口

Question

他们的一种方式，当打开特定网页时会出现一个弹出窗口，直到我从该弹出窗口中选择某个值，我无法在后台网页中做蚂蚁的事情，并且该网页的执行暂停，直到弹出窗口是他们的。我发现这个：

win2 = window.open("popup_choose_template.html", "Window2", "width=310,height=600,scrollbars=yes");

但它就像另一个可以关闭或忽略的网页。
应该有更好的方法吗？

Answer 1

您可以将 jQueryUI 与 Modal 对话框一起使用：

例如：

$( "#dialog-confirm" ).dialog({
    height:140,
    modal: true,
    buttons: {
        "Ok": function() {
            $( this ).dialog( "close" );
        },
        Cancel: function() {
            $( this ).dialog( "close" );
        }
    }
});

它禁用所有后台页面并强制用户执行某些操作。

Answer 2

您可以使用模态面板之类的东西。

"喜欢 jQuery"对话框

Answer 3

最简单的方法可能是使用 JQuery UI 并使用模式设置为 true 的对话框控件。这将显示一个弹出窗口，背景变暗并禁用。

http://jqueryui.com/demos/dialog/#option-modal

否则，如果您想手动完成，请添加 100% 宽度和高度div，绝对定位为黑色背景颜色、部分透明度和比页面其余部分更高的 z 索引。 将此div 附加到正文，并确保您的弹出窗口具有比停电div 更高的 z 索引

编辑

你需要一个固定的位置div不是绝对的...喜欢这个：

<div id="blackout" style="position:fixed; width:100%; height:100%; z-index:100; background-color:black; opacity:0.5;"></div>

这假设所有普通页面元素的 z 索引都低于 100，并且您为弹出窗口提供的 z 索引高于 100。使用 js 弹出功能附加到正文，然后在满意的选择后删除。