Универсальная замена createPopup()?

Question

В настоящее время createPopup() поддерживается только в IE (см. http://help.dottoro.com/ljsxcrhv.php).

Есть ли универсальная замена createPopup()? Или требуется условный код на основе обнаружения браузера?

Надеюсь, я ищу что-то, что не только обеспечивает ту же функциональность, но имеет тот же интерфейс или, по крайней мере, может предоставить ингредиенты для создания клона без особого труда.

Answer 1

Возможно, вам захочется ознакомиться с некоторыми библиотеками JavaScript. Такие вещи, как Dojo, пользовательский интерфейс Yahoo или JQuery, могут помочь инкапсулировать большинство головных болей, связанных с браузером. Например, с Dojo, взгляните на http://dojotoolkit.org/api/. Это даст вам аналогичную функциональность createPopup().

Answer 2

Что такое window.open()?

http://www.w3schools.com/jsref/met_win_open.asp

Answer 3

Так что я был весь беспорядок унаследованного кода, который используется window.createPopup() так меняющимся в библиотеку была бы много усилий, и теперь, когда IE 11 не поддерживает этот метод, мы должны были сделать что-то, потому что наше приложение создано для поддержки Explorer. Я был в состоянии решить эту проблему, чтобы работать в других браузерах, написав следующий код:

if(!window.createPopup){ 
    window.createPopup = function(){ 
     var popup = document.createElement("iframe"), //must be iframe because existing functions are being called like parent.func() 
      isShown = false, popupClicked = false; 
     popup.src = "about:blank"; 
     popup.style.position = "absolute"; 
     popup.style.border = "0px"; 
     popup.style.display = "none"; 
     popup.addEventListener("load", function(e){ 
      popup.document = (popup.contentWindow || popup.contentDocument);//this will allow us to set innerHTML in the old fashion. 
      if(popup.document.document) popup.document = popup.document.document; 
     }); 
     document.body.appendChild (popup); 
     var hidepopup = function (event){ 
      if(isShown) 
       setTimeout(function(){ 
        if(!popupClicked){ 
         popup.hide(); 
        } 
        popupClicked = false; 
       }, 150);//timeout will allow the click event to trigger inside the frame before closing. 
     } 

     popup.show = function (x, y, w, h, pElement){ 
      if(typeof(x) !== 'undefined'){ 
       var elPos = [0, 0]; 
       if(pElement) elPos = findPos(pElement);//maybe validate that this is a DOM node instead of just falsy 
       elPos[0] += y, elPos[1] += x; 

       if(isNaN(w)) w = popup.document.scrollWidth; 
       if(isNaN(h)) h = popup.document.scrollHeight; 
       if(elPos[0] + w > document.body.clientWidth) elPos[0] = document.body.clientWidth - w - 5; 
       if(elPos[1] + h > document.body.clientHeight) elPos[1] = document.body.clientHeight - h - 5; 

       popup.style.left = elPos[0] + "px"; 
       popup.style.top = elPos[1] + "px"; 
       popup.style.width = w + "px"; 
       popup.style.height = h + "px"; 
      } 
      popup.style.display = "block"; 
      isShown = true; 
     } 

     popup.hide = function(){ 
      isShown = false; 
      popup.style.display = "none"; 
     } 

     window.addEventListener('click', hidepopup, true); 
     window.addEventListener('blur', hidepopup, true); 
     return popup; 
    } 
} 
function findPos(obj, foundScrollLeft, foundScrollTop) { 
    var curleft = 0; 
    var curtop = 0; 
    if(obj.offsetLeft) curleft += parseInt(obj.offsetLeft); 
    if(obj.offsetTop) curtop += parseInt(obj.offsetTop); 
    if(obj.scrollTop && obj.scrollTop > 0) { 
     curtop -= parseInt(obj.scrollTop); 
     foundScrollTop = true; 
    } 
    if(obj.scrollLeft && obj.scrollLeft > 0) { 
     curleft -= parseInt(obj.scrollLeft); 
     foundScrollLeft = true; 
    } 
    if(obj.offsetParent) { 
     var pos = findPos(obj.offsetParent, foundScrollLeft, foundScrollTop); 
     curleft += pos[0]; 
     curtop += pos[1]; 
    } else if(obj.ownerDocument) { 
     var thewindow = obj.ownerDocument.defaultView; 
     if(!thewindow && obj.ownerDocument.parentWindow) 
      thewindow = obj.ownerDocument.parentWindow; 
     if(thewindow) { 
      if (!foundScrollTop && thewindow.scrollY && thewindow.scrollY > 0) curtop -= parseInt(thewindow.scrollY); 
      if (!foundScrollLeft && thewindow.scrollX && thewindow.scrollX > 0) curleft -= parseInt(thewindow.scrollX); 
      if(thewindow.frameElement) { 
       var pos = findPos(thewindow.frameElement); 
       curleft += pos[0]; 
       curtop += pos[1]; 
      } 
     } 
    } 
    return [curleft,curtop]; 
} 

Начну признать, что это довольно некрасиво. Тем не менее, это помогло мне сделать код, который называет этот метод работать в других браузерах, и было проще, чем сменить десятки старых (и плохо кодированных в противном случае) страниц, чтобы использовать некоторую внешнюю библиотеку, поэтому, возможно, это поможет кому-то еще.

Он использует iframe и создает на нем свойство document, потому что у нас было много кода, который был по строкам popup.document.body.innerHTML = "<span onclick = 'parent.someFunction()'>";. Использование iframe вместо div позволяет это оставаться в состоянии junky и все еще работать.