Question

点击“关闭”anchor不会关闭通知。

以下是我的代码：

function show_notification_on_top(message, type) {  

    content =   "<a class='notify-close' onclick='$(\"#notification-box\").fadeOut(\"slow\");' href='#'>close</a>"+ 
                "<p>"+message+"</p>";                   

    $("#notification-box").fadeIn('slow', function() {
            $("#notification-box").delay(60000).fadeOut('slow');
        });

    $("#notification-box").html( content ); 
}

Answer 1

请勿在{{1}}个链接上对onclick个事件进行硬编码，请使用<a>不引人注目的订阅者。

JQuery click

Answer 2

没有尝试过代码，但你想要这样的东西......

function show_notification_on_top(message, type) {                  

    var anc = $('<a>').addClass('notify-close').html('close').click(function() {$('#notification-box').fadeOut();   });

    $("#notification-box").append( anc ).fadeIn('slow', function() {
            $("#notification-box").delay(60000).fadeOut('slow');
    });


}

Answer 3

实际上，这不起作用。几件事。

首先：将click事件添加到代码中，而不是添加到标记中。这可以真正简化函数中的代码。

第二：由于之前的延迟和fadeOut到位，您的动画尝试（fadeOut）将失败。要正确地工作，只需将您拥有的那个出列。

function show_notification_on_top(message, type) {
    content = "<a class='notify-close' href='#'>close</a>" + "<p>" + message + "</p>";
    $("#notification-box").fadeIn('slow').delay(60000).fadeOut('slow');
    $("#notification-box").html(content);
}

$(document).on('click', '.notify-close', function() {
    $('#notification-box').dequeue();
});

请注意，.on('click',添加了一个实时事件处理程序，允许您从标记中删除该事件。

我写的代码是什么：显示关闭的消息，你可以激活，如果没有手动关闭，等待60000毫秒，然后按照定义淡出。

以下是一个工作示例：http://jsfiddle.net/MarkSchultheiss/X6qDJ/

编辑：OP注意。如果您已经确定必须立即包含该事件，则可以将代码更改为：

content = "<a class='notify-close' onclick='$(\"#notification-box\").dequeue();' href='#'>close</a>" + "<p>" + message + "</p>";

而不是：

content =   "<a class='notify-close' onclick='$(\"#notification-box\").fadeOut(\"slow\");' href='#'>close</a>" + "<p>"+message+"</p>";

Answer 4

谢谢你们所有人。在你的帮助下，我写了这段代码。工作得很好。

function show_notification_on_top(message) {

    content =       "<a class='notify-close' id='notification_anchor' href='#'>close_button_label</a>"+ 
                    "<p>"+message+"</p>";


    $("#notification-box").fadeIn('slow');

    $("#notification-box").html( content );

    $('#notification_anchor').click(function() {
        $("#notification-box").fadeOut("slow");
    });

    window.setTimeout(function() {
        $("#notification-box").fadeOut('slow');
    }, 6000);
}

Answer 5

添加：

$(document).ready(function(){
  $(".notify-close").live("click", function(){
    $("#notification-box").fadeOut('slow');
  });
});

忘了 onclick（）事件;

如何在JavaScript onclick函数中运行jQuery代码？

5 个答案: