Question

我已经实施了新手到忍者咆哮通知。但最后的通知不会发生。我甚至检查了原始的站点代码，并且还有最终的消息。

当我点击第二个气泡的关闭按钮时没有任何反应 - 添加了setTimeout，即

<p>Stay awhile!</p><p>Stay FOREVER!</p>

任何帮助将不胜感激。

javascript代码如下：

$(document).ready(function(){
addNotice('<p>Welcome to StarTrackr!</p>');

setTimeout(function() {
    addNotice('<p>Stay awhile!</p><p>Stay FOREVER!</p>');
}, 1000);

$('#growl')
.find('.close')
.on('click', function() {
    $(this)
        .closest('.notice')
        .animate({
            border: 'none',
            height: 0,
            marginBottom: 0,
            marginTop: '-6px',
            opacity: 0,
            paddingBottom: 0,
            paddingTop: 0,
            queue: false
        }, 1000, function() {
            $(this).remove();
        });
});
});

function addNotice(notice) {
$('<div class="notice"></div>')
    .append('<div class="skin"></div>')
    .append('<a href="#" class="close">close</a>')
    .append($('<div class="content"></div>').html(notice))
    .hide()
    .appendTo('#growl')
    .fadeIn(1000);
}

Answer 1

你需要

$('#growl')
    .on('click', '.close', function() {

.close元素是动态创建的，.find()在此时无法找到它，因为它尚不存在。

Ninja咆哮消息的新手 - .on函数不适用于使用setTimeout添加的元素

1 个答案: