首页 > 解决方案 > 脚本不记得将我的 div 设置为不显示

问题描述

我有一个订阅框,我正在尝试制作一个 X 关闭按钮,该按钮记住下次使用网络存储或 cookie 时不会显示。当我单击关闭按钮时,我的整个侧边栏设置为不显示。而不仅仅是 id="gfxhsub" 。

JavaScript

window.onload = function(){
    document.getElementById('mailclose').onclick = function(){
        this.parentNode.parentNode.parentNode
        .removeChild(this.parentNode.parentNode);
       return false;
    };
};

html

<div id="gfxhsub" style="margin: 2em 0.5em; height: auto;">
<span id='mailclose'><i class="fa fa-times"></i></span>
[newsletter_signup_form id=6]
</div>

标签: javascript

解决方案


在 css 中创建一个类 .d-none 并使用document.getElementById('gfxhsub').classList += "d-none"而不是this.parentNode.parentNode.parentNode .removeChild(this.parentNode.parentNode);

.d-none {
  display: none
}
<div id="gfxhsub" style="margin: 2em 0.5em; height: auto;">
  <span id='mailclose'><i class="fa fa-times"></i>X</span> [newsletter_signup_form id=6]
</div>

<script type="text/javascript">
  window.onload = function() {
    document.getElementById('mailclose').onclick = function() {
      document.getElementById('gfxhsub').classList += "d-none"
      return false;
    };
  };
</script>


推荐阅读