jQuery onClick隱藏<div>

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

您提供的代碼可以正常工作 。

如果要動態添加“ closingnote”或“ xbutton”分隔符，則需要將click事件委托給使用jQuery的on()方法添加到頁面之前創建的祖先：

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

如果仍然無法執行此操作，則只能得出結論，您要么忘記了包含jQuery，要么在代碼后包含了jQuery ，要么正在使用具有相同id多個元素。

檢查瀏覽器的JavaScript控制台 ，看是否拋出任何錯誤，並確保id是唯一的。