2014-02-11 107 views
0

我遇到了firefox和innerhtml的問題。我想不通爲什麼它不工作:/鉻,歌劇,IE,Safari瀏覽器工作正常,但Firefox ...Mozilla Firefox innerhtml無法正常工作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<head> 
    <title>Dokument bez názvu</title> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="text/css" href="css/styl.css"> 
    <script type='text/javascript' src='js/jquery-1.9.1.js'></script> 
    <style> 
     #displaybox 
     { 
      z-index: 10000; 
      filter: alpha(opacity=100); /*older IE*/ 
      filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* IE */ 
      -moz-opacity: 1; /*older Mozilla*/ 
      -khtml-opacity: 1; /*older Safari*/ 
      opacity: 1; /*supported by current Mozilla, Safari, and Opera*/ 
      position: fixed; 
      top: 20px; 
      left: 0px; 
      width: 100%; 
      height: 100%; 
      color: #FFFFFF; 
      text-align: center; 
      vertical-align: middle; 
     } 
     body 
     { 
      font-family: Calibri; 
     } 
     .black_overlay 
     { 
      visibility: hidden; 
      position: absolute; 
      top: 0%; 
      left: 0%; 
      width: 100%; 
      height: 100%; 
      background-color: black; 
      z-index: 1001; 
      -moz-opacity: 0.7; 
      opacity: .70; 
      filter: alpha(opacity=70); 
     } 
    </style> 
    <script> 
     function clicker() { 
      var thediv = document.getElementById('displaybox'); 
      if (thediv.style.display == "none") { 
       thediv.style.display = ""; 
       thediv.innerHTML = "<embed src='prohlidka.html' height='638' width='1024' ></embed>"; 
       var thelay = document.getElementById('fade'); 
       thelay.style.visibility = "visible"; 
      } else { 
       thediv.style.display = "none"; 
       thediv.innerHTML = ''; 
       var thelay = document.getElementById('fade'); 
       thelay.style.visibility = "hidden"; 
      } 
      return false; 
     } 

    </script> 
</head> 
<body> 
    <div id="fade" class="black_overlay"> 
    </div> 
    <div id="displaybox" style="display: none; overflow: visible"> 
    </div> 
    <a id="otevrit" href='#' onclick='return clicker();'>Virtuální mapa</a> 
</body> 

這是我的代碼,CSS的一點點,一個功能和身體。正如我所說,其他瀏覽器工作正常。他們通常顯示innerhtml正是我需要的。但Firefox並沒有,黑色覆蓋工作正常。沒有錯誤,當我檢查javascript時沒有消息。

回答

0

您的代碼在Mozilla Firefox中正常工作。

我用它在此琴:WORKING FIDDLE,只是添加了此行的代碼: console.log($('#displaybox').html());和我得到的答案是: <embed src="https://www.google.com/" height="638" width="1024">,因爲我已經提供了相同的輸入這是正確的。

當我看到螢火蟲中的編號爲displaybox時,我能夠看到embed代碼被嵌入在該ID中。

因此,從技術上來說代碼沒有問題,如果您想要打開頁面,那麼您的logicwrong。您必須使用iframe src而不是embed來打開頁面。

+0

我跑這個代碼以及它工作正常。 – bergie3000

+0

我用iframe替換了嵌入,它工作正常:D非常感謝你。它也解決了我的其他問題^^ – user3197269

+0

@ user3197269:很高興有幫助:) –

0

我不是innerhtml這個問題,它是<embed>標記。這並不意味着打開網頁,但例如視頻。您應該嘗試使用類似的東西。

0

我遇到了同樣的問題。解決方案是,您可以使用.value而不是.innerHTML從Div中獲取值。這對於你將要使用的任何瀏覽器來說都會很蹩腳。