javascript - jQuery onClick 隐藏

Question

我不太明白为什么我的 jQuery 没有删除/隐藏特定的 div 我看过几个例子，它应该工作得很好。这是在 Drupal 7 上的 jQuery 上完成的。这里是它的网站：http: //mahonysbeta.scdmarketing.com/

HTML

<div id="closingnote">
<div class="xbutton">X</div>
<img class="note" src="/sites/default/files/ClosingNote.png">
</div>

CSS

/*closing note*/
#closingnote {
    left: 20%;
    position: absolute;
    top: 175px;
    z-index: 9999;
}

.xbutton {
    position: absolute;
    padding: 3px 5px 0px; 
    left: 237px; 
    top: 10px;
    color: black;
    border: 1px black solid;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 10px;
}

JS

(function ($) {
    $('.xbutton').click(function(){
        $('#closingnote').remove();
    });
})(jQuery);

Answer 1

您提供的代码运行良好。

如果您要动态添加“closuresnote”或“xbutton”分隔符，则需要将单击事件委托给在使用jQuery on()方法将其添加到页面之前创建的祖先：

$('body').on('click', '.xbutton', function() {
    $('#closingnote').remove();
});

如果这仍然不起作用，则只能得出结论，您要么忘记包含 jQuery，要么在代码后包含 jQuery，要么正在使用具有相同id.

检查浏览器的JavaScript 控制台以查看是否抛出任何错误，并确保您id的 s 是唯一的。