获取弹出信息

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>

我希望显示“infoText”而不是“somethin ...”，我真的无法找到方法。任何人都可以帮助我吗？

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;