IE的問題，並附加到window.opener

Question

我有以下腳本，在Firefox和Chrome（不知道其他瀏覽器），但它在IE瀏覽器根本不工作。它基本上打開一個彈出窗口，其中添加一個div來突出顯示窗口中的項目。我希望它可以在同一網站上的多個頁面上工作，所以我不想添加一個函數來在主窗口（window.opener）中創建div。抱歉，我無法發佈工作演示 - window.opener無法在bin中工作。

<button>Open popup</button> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$(':button').click(function(){ 
    var highlight = "" + 
    "<button>Click to Add Highlight</button>" + 
    "<scr"+"ipt type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js'></scr"+"ipt>" + 
    " <scr"+"ipt type='text/javascript'>" + 
    " $(':button').click(function(){" + 
    " $('<div/>', {" + 
    " 'class': 'highlight'," + 
    " css: {" + 
    " position: 'absolute'," + 
    " height:  '50px'," + 
    " width:  '50px'," + 
    " left:  '200px'," + 
    " top:  '200px'," + 
    " background: '#fff'," + 
    " opacity: 0.5," + 
    " zIndex:  99" + 
    " }" + 
    " }).appendTo($(window.opener.document.body));" + 
    " })" + 
    " </scr"+"ipt>"; 
    var w = window.open('','highlighter','toolbar=0,location=0,status=0,width=200,height=100,scrollbars=1,resizable=1'); 
    w.document.write(highlight); 
    w.document.close(); 
}) 
}) 
</script> 

我也嘗試過使用appendChild而沒有成功。我最終發現這種方法可行，但這是一個可怕的解決方案，並導致頁面眨眼。

if ($.browser.msie){ 
var d = '<div class="highlight" style="position:absolute;height:50px;' + 
    'width:50px;left:200px;top:200px;background:#fff;opacity:0.5;' + 
    'filter:alpha(opacity=50);zIndex:99;"></div>'; 
window.opener.document.body.innerHTML = window.opener.document.body.innerHTML + d; 
} 

任何人都知道更好的解決方案嗎？

Answer 1

我想我找到了問題。這可能是一個jQuery的錯誤，但我不能告訴...我會張貼另一個問題來獲得幫助。

所以我通過追加一個字符串找到了解決這個問題的方法。出於某種原因，IE中的jQuery不會追加一個對象。所以這個工程：

if ($.browser.msie){ 
var d = '<div class="highlight" style="position:absolute;height:50px;width:50px;left:200px;' + 
    'top:200px;background:#fff;opacity:0.5;filter:alpha(opacity=50);zIndex:99;"></div>'; 
$(window.opener.document.body).append(d); 
} 

---

編輯：尖尖的解決我的問題在another question。事實證明，這不是一個錯誤，但IE不允許你追加在窗口外創建的對象。他的解決方案如下：

window.opener.$('<div/>', { 
'class': 'highlight', 
css: { 
    position: 'absolute', 
    height:  '50px', 
    width:  '50px', 
    left:  '200px', 
    top:  '200px', 
    background: '#fff', 
    opacity: 0.5, 
    zIndex:  99 
} 
} 

但確保window.opener使用jQuery v1.4或更高版本。

Answer 2

你沒有打開它

var w = window.open(...); 
w.document.open(); //Open the document up 
w.document.write(highlight); 
w.document.close(); 

埃裏克