在網頁執行之前創建一個強制選擇彈出框

Question

是他們的一種方式，當一個特定的網頁打開時會彈出一個彈出窗口，直到我從該彈出窗口中選擇一些值，我不能在後臺做螞蟻的東西網頁，並且此網頁的執行停止，直到彈出爲止。 我發現這一點：

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

但它像只是一個網頁，它可以被關閉或不理睬。
什麼應該是更好的方法？

Answer 1

您可以使用jQueryUI with Modal Dialog：

如：

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

它禁用所有背景頁和部隊用戶做一些事情。

Answer 2

最簡單的方法是使用JQuery UI並使用模式設置爲true的對話框控件。這將顯示一個背景變暗和禁用的彈出窗口。

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

否則，如果你想通過做手工，你添加一個100％的寬度和高度DIV，絕對定位與黑色的背景色，部分透明&較高的z-index比頁面的其餘部分。追加這個div身體，並確保您的彈出具有更高的z-index比停電DIV

編輯

你需要一個固定的位置格設置不是絕對的......這樣的：

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

這個假設你所有的普通頁面元素都有一個低於100的z-index，並且你的彈出窗口的z-index大於100.用js彈出功能附加到主體，然後在滿意的選擇下刪除。

Answer 3

您可以使用模態面板類的東西。

Like jQuery dialog