Javascript document.getElementById set input

Question

У меня есть некоторый валидатор ввода, который проверяет, нет ли электронной почты пользователя и имени пользователя на сайте. Мой код lõoke так:

Javascript:

$(document).ready(function() 
{ 
    $('#email').blur(function(event) { 
     $.get(BaseUrl + 'auth/email/check/' + $(this).val(), function(data) 
     { 
      if (data == 1) { 
       $('input#email').removeClass('valid'); 
       $('input#email').addClass('error'); 
       document.getElementById('div-error').style.display = "block"; 
      } else { 
       document.getElementById('div-error').style.display = "none"; 
      } 
     }); 
    }); 
      $('#username').blur(function(event) { 
     $.get(BaseUrl + 'auth/username/check/' + $(this).val(), function(data) 
     { 
      if (data == 1) { 
       $('input#username').removeClass('valid'); 
       $('input#username').addClass('error'); 
       document.getElementById('div-error').style.display = "block"; 
      } else { 
       document.getElementById('div-error').style.display = "none"; 
      } 
     }); 
    }); 
}); 

DIV код после ввода имени пользователя:

<div id="div-error" style="display: none;">username has alerdy registered</div> 

код DIV после электронной почты ввода:

<div id="div-error" style="display: none;">email already registered</div> 

Но затем имя пользователя не зарегистрирована и уже зарегистрирована электронная почта. Я получаю ошибку на всех этих двух входах ... Как я могу установить document.get ElementById для специальных входов?

Answer 1

Ваши идентификаторы ошибок имеют одинаковый идентификатор. Идентификатор в HTML должен быть уникальным.
Попробуйте давать эти элементы классы, как

<div class="div-error" id="div-error-username" style="display: none;">...</div> 

<div class="div-error" id="div-error-email" style="display: none;">...</div>