Question

$('#login').click(function () {
    
    var user = $('#user_email').val();
    var pwd = $('#pwd').val();
    
    if(user != "test" || pwd != "test"){
         $('#errors').html("Error");
    }else{
          $('#errors').html("Hello");
    }
    
   

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<fieldset>
    <legend>Login:</legend>Email:
    <br>
    <input type="text" id="user_email" value="">
    <br>Password:
    <br>
    <input type="password" id="pwd" value="">
    <br>
    <br>
    <input id="login" type="submit" value="Submit">
</fieldset>
<div id="errors"></div>

当我在谷歌浏览器上运行此代码时，第一次我输错了凭据，错误div出现并自动消失。第二次出现错误div并保持不变。为什么它只发生在Google Chrome上。 Firefox效果很好。

Answer 1

<强> DEMO

首先，您需要添加一些css来隐藏或显示下面的div：

#errors{
    display:none;
}

然后show或hide延迟5秒或您想要的任何时间，如下所示：

$('#login').click(function () {
    var user = $('#user_email').val();
    var pwd = $('#pwd').val();
    if(user != "test" || pwd != "test"){
         $('#errors').html("Error").show('slow').delay(5000).hide('slow');//delay here is 5 seconds and so its value is 5000
    }else{
          $('#errors').html("Hello").show('slow').delay(5000).hide('slow');//same as above
    }
});

JQuery - 双击谷歌浏览器以显示错误div

1 个答案: