函数未更新事件值

Question

这是我的函数

function showNotificationBar(message) {

    /*set default values*/
    duration = typeof duration !== 'undefined' ? duration : 3000;
    bgColor = typeof bgColor !== 'undefined' ? bgColor : "#CAFFC7";
    txtColor = typeof txtColor !== 'undefined' ? txtColor : "#51A427";
    height = typeof height !== 'undefined' ? height : 40;
    /*create the notification bar div if it doesn't exist*/
    if ($('#notification-bar').size() == 0) {
        var HTMLmessage = "<div class='notification-message' style='text-align:center; line-height: " + height + "px;'> " + message + " </div>";
        $('#header').prepend("<div id='notification-bar' style='display:none; width:100%; height:" + height + "px; background-color: " + bgColor + "; position: fixed; z-index: 100; color: " + txtColor + ";border-bottom: 1px solid " + txtColor + ";'>" + HTMLmessage + "</div>");
    }
    /*animate the bar*/
    $('#notification-bar').slideDown(function() {
        setTimeout(function() {
            $('#notification-bar').slideUp(function() {});
        }, duration);
    });
}

但是当我使用showNotificationBar(" hi ")时，它会显示hi，之后当我使用showNotificationBar("hi2")时，它会再次显示hi，请帮助我

Answer 1

这可能是因为您正在使用第一个文本创建元素。您必须将其创建为空，并在每次设置文本：

function showNotificationBar(message) {

    /*set default values*/
    duration = typeof duration !== 'undefined' ? duration : 3000;
    bgColor = typeof bgColor !== 'undefined' ? bgColor : "#CAFFC7";
    txtColor = typeof txtColor !== 'undefined' ? txtColor : "#51A427";
    height = typeof height !== 'undefined' ? height : 40;

    /*create the notification bar div if it doesn't exist*/
    if ($('#notification-bar').size() == 0) {
        var HTMLmessage = "<div class='notification-message' style='text-align:center; line-height: " + height + "px;'></div>";
        $('#header').prepend("<div id='notification-bar' style='display:none; width:100%; height:" + height + "px; background-color: " + bgColor + "; position: fixed; z-index: 100; color: " + txtColor + ";border-bottom: 1px solid " + txtColor + ";'>" + HTMLmessage + "</div>");
    }

    /* add/update the text message */
    $(".notification-message").text(message);

    /*animate the bar*/
    $('#notification-bar').slideDown(function() {
        setTimeout(function() {
            $('#notification-bar').slideUp(function() {});
        }, duration);
    });
}

请注意，它创建的.notification-message为空，然后添加文本消息。