2016-03-06 64 views
3

我正在處理多個函數將各種事件監聽器添加到最初隱藏的div的事情,我們只需將其稱爲secretBlock。只有一個將永遠是活躍在任何給定的點,但都表示職能將由操縱它:Javascript無法在克隆後取消隱藏元素?

  • 首先克隆sercetBlock,以確保沒有以前的聽衆仍然會附加
  • 然後將顯示設置爲flex

HTML:

<div id="secretBlock" hidden>Secret</div> 

的JavaScript:

function exampleFuction() { 
    var secretBlock = document.getElementById('secretBlock'); 
    var secretClone = secretBlock.cloneNode(true); 
    secretBlock.parentNode.replaceChild(secretClone, secretBlock); 
    secretBlock.style.display = 'flex'; 
    .... 
} 

但設置顯示器的最後一部分未觸發。

我以爲這已經是與異步的煩躁,但

setTimeout(function(){ secretBlock.style.display = 'flex' }, 999); 

也沒有效果。

然而,其中一個功能設置顯示,使其正確火災後追加的另一個DIV權在div:

secretBlock.parentNode.replaceChild(secretClone, secretBlock); 
secretBlock.style.display = 'flex'; 
otherDiv.appendChild(secretBlock); 

位的測試之後,我發現它不」不管什麼時候我設置顯示器(現在或以後)或代碼中的位置,只要secretBlock被附加到另一個div,顯示器的改變將被註冊,否則保持隱藏狀態。

.......這八九不離十留給我無能,這是怎麼回事,任何有識之士將因此非常感謝~~

+1

它不是隱藏的,它不是文檔的一部分,因爲您從文檔中刪除了secretBlock:'secretBlock.parentNode.replaceChild(secretClone,secretBlock);' –

+0

@ Dr.Molle我在那之後添加了一個返回檢查,但鉻說,它仍然存在?雖然元素閃現暗示着一個變化。 – House3272

回答

-1

當時參考的問題。
.replaceChild()後替換secretBlock,初始參考:

var secretBlock = document.getElementById('secretBlock') 

變得過時,因爲它仍然指向這是不分開的html文件的再老,原始的元素。因此,你需要參考重定向到克隆的元素:

secretBlock.parentNode.replaceChild(secretClone, secretBlock); 
secretBlock = document.getElementById('secretBlock'); 
secretBlock.style.display = 'flex'; 

感謝Dr.Molle