javascript - 使用 javascript 显示错误

Question

使用 javascript 我想显示错误消息，该消息将在 2 秒后隐藏/消失。该错误完美显示并在 2 秒后隐藏，但第二次就不起作用了。如果我重新加载页面，它会再次完美工作，依此类推。

JavaScript

if(task_hour == "hour" || task_minute == "minute"){

        document.getElementById("error").innerHTML = "Add Time for the Task";
        setTimeout(function(){ document.getElementById("error").style.display="none"; }, 2000);

        return false;
    }

HTML

<div id="errordiv" align="center" style="margin-left: auto; margin-right: auto;"> 
   <span id="error" style="color: red"> </span> 
</div>

Answer 1

您应该将 div 设置为最初隐藏(display: none)并使用 display: block 显示它:

JS:

var timer = null;

function showError(message) {
    if (timer !== null) {
        // Clear previous timeout:
        clearTimeout(timer);
        timer = null;
    }
    var errorElement = document.getElementById("error");
    errorElement.innerHTML = message;
    errorElement.style.display = 'block';
    timer = setTimeout(function(){ errorElement.style.display = 'none'; }, 2000);
}

showError('Error!');

HTML:

<div id="errordiv" align="center" style="margin-left: auto; margin-right: auto;"> 
    <span id="error" style="color: red; display: none"></span> 
</div>