上彈出

Question

獲取信息，我有這樣的代碼

<button id="LearnMoreBtn" class="infobutton">Learn More</button> 
    <div id="overlay"></div> 
    <div id="popup"> 
     somethin... 
    <button id="CloseBtn">Close</button> 
    </div> 

<script> 
window.onload = function() { 
document.getElementById("LearnMoreBtn").onclick = function(){ 
    var x = $('.carousel .item.active'); 
    var infoText = x.attr('info-text'); 
    //alert(infoText); 
    var overlay = document.getElementById("overlay"); 
    var popup = document.getElementById("popup"); 
    overlay.style.display = "block"; 
    popup.style.display = "block"; 
}; 

document.getElementById("CloseBtn").onclick = function(){ 
    var overlay = document.getElementById("overlay"); 
    var popup = document.getElementById("popup"); 
    overlay.style.display = "none"; 
    popup.style.display = "none";  
} 
}; 
</script> 

，我想，以顯示「信息文本」，而不是「事端......」我實在無法找出如何。誰能幫我？

Answer 1

使用popup.innerHTML = infoText

看看在這裏： https://plnkr.co/edit/75B3eyFdkOj4S0ZkoLZ7?p=preview

如果您使用的innerHTML，按鈕也將消失，所以我把它放在外面。

另一種可能的解決方案是如果您在您的popup內部創建另一個包含內容的div。

<div id="popup"> 
    <div id="content">blablabla</div> 
    <button id="CloseBtn">Close</button> 
</div> 

，並在你的腳本，你再使用document.getElementById("content").innerHTML = infoText;