javascript - 如何消除登录成功后的错误提示

Question

我有一个登录页面，可以通过 api 获取用户名和密码。成功登录后还会显示一条错误消息，显示如何删除。这是我的fiddle 。帮助我如何删除成功后的错误消息。如果密码错误，则应显示错误消息。

HTML

<form id="login">
                  <p class="text-danger d-none">Please enter a correct login and password.</p>
                  <div class="form-group pb-10">
                      <div class="input-group">
                         <div class="input-group-addon p-2">
                            <i class="fa fa-user icon"></i>
                         </div>
                        <input type="text" class="form-control" id="name" name="name" placeholder="Username" required>
                     </div>
                  </div>
                   <div class="form-group">
                      <div class="input-group">
                         <div class="input-group-addon p-2">
                            <i class="fa fa-lock icon"></i>
                         </div>
                       <input type="password" class="form-control" id="password" name="password" placeholder="Password" required>
                     </div>
                  </div>

                  <div>

                  <button type="submit" class="btn float-right login-btn">Login</button>
                </div>
               </form>

脚本:

 $(document).ready(function(){
    localStorage.removeItem('role');
    $(".login-error").hide();
    $("#login").on("submit", function (e) {
     e.preventDefault();
    var form_data = $('#login').serialize();
    var username=$("#name").val();
    var pwd=$("#password").val();
       $.ajax({
          url: "https://api.myjson.com/bins/nl8a0",
          type: "GET",
          dataType: "json",
          success: function (data) {
                console.log(typeof(data));
             var arr = data;
                arr.forEach(function(obj) {
                   console.log('name: ' + obj.name);
                   console.log('password: ' + obj.role);
                   var pass=obj.password; 
                   // var decryptedBytes = CryptoJS.AES.decrypt(obj.password, "password");
                   var bytes  = CryptoJS.AES.decrypt(pass.toString(), 'password');
                   var plaintext = bytes.toString(CryptoJS.enc.Utf8);
                   var role=obj.role;
                      if(role=="User"){
                         if(username==obj.name && pwd==plaintext){
                         alert("New role");
                         }
                         else{
                            $("#login p").removeClass("d-none");
                         }
                      }
                      else{
                   if(username==obj.name && pwd==plaintext){
                   alert("Login succes");
                   }
                   else{
                      $("#login p").removeClass("d-none");
                   }
                }
                })
          },
             error: function(data) {
             console.log(data);
       }
       });

 });
});

Answer 1

登录成功后您错过了添加已删除的类d-none。

 $("#login p").addClass("d-none");