Попытка создать программу на javascript для создания учетной записи

#javascript

Вопрос:

Требование таково : «Если регистрация не может быть выполнена успешно, вы сможете отобразить это сообщение об ошибке, которое вы хотите. Вместо этого, если все условия выполнены, вы должны скрыть все элементы на странице, связанные с регистрацией, и отобразить в дополнительном месте любое сообщение, которое вы хотите».

И это то, что я сделал в javascript, но позвольте мне объяснить вам. Когда я пытаюсь проверить, правильны ли условия, например, я ставлю «123456789» в качестве пароля и «12345678» для подтверждения пароля. Появится ошибка «оба пароля должны совпадать», и ошибка останется там, даже если я наберу правильный пароль для этих 2 меток (для пароля-123456789 и подтверждения пароля-123456789). Что я должен сделать, чтобы скрыть эту ошибку?

         let btn=document.getElementById('register-button');
    let divsucc=document.getElementById('success-message');
    let diverr=document.getElementById('error-message');
    let username=document.getElementById('username');
    let password=document.getElementById('password');
    let confirmpassword=document.getElementById('confirm-password');
    let usernamediv=document.getElementById('username-div');
    let passworddiv=document.getElementById('password-div');
    let confirmpassworddiv=document.getElementById('confirm-password-div');
    let btndiv=document.getElementById('register-button-div')
    btn.onclick=function(){
        if(password.value.length<=8 amp;amp; username.value.length==0 || password.value.length>=8 amp;amp; username.value.length==0){
            diverr.innerHTML="Enter your username";
        }
        else if(username.value.length>0 amp;amp; password.value.length==0){
            diverr.innerHTML="Enter your password";
        }
        else if(confirmpassword.value.length==0){
            diverr.innerHTML="Confirm your password";
        }
        else if(password.value!=confirmpassword.value){
            diverr.innerHTML="Both passwords must match";
        }
        else if(password.value.length<8){
            diverr.innerHTML="Password must be at least 8 characters";
        }
        else if(username.value.length>0 amp;amp; password.value.length>=8 amp;amp; password.value===confirmpassword.value){
            usernamediv=usernamediv.style.visibility='hidden';
            passworddiv=passworddiv.style.visibility='hidden';
            confirmpassworddiv=confirmpassworddiv.style.visibility='hidden';
            btndiv.style.visibility='hidden';
            divsucc.innerHTML="Account created!";
        }
    } 
 <html>
    <body>
        <h1>Create an account</h1>
        <div id="error-message"></div>
        <div id="success-message"></div>
        <div id="username-div">
            Username: <input id="username">
        </div>
        <br>
        <div id="password-div">
            Password: <input type="password" id="password">
            Must be at least 8 characters
        </div>
        <br>
        <div id="confirm-password-div">
            Confirm password: <input type="password" id="confirm-password">
            Both passwords must match
        </div>
        <br>
        <div id="register-button-div">
            <button id="register-button">Register now</button>
        </div>
    </body>
</html> 

Ответ №1:

Если отображение ошибки происходит путем установки текста здесь:

 diverr.innerHTML="Both passwords must match";
 

Затем, предположительно, вы можете скрыть ошибку, установив тот же текст в пустое значение:

 diverr.innerHTML="";
 

Вы можете сделать это в ответ на все, что вам нравится. Например, если вы хотите, чтобы ошибка исчезла при нажатии кнопки, просто сделайте это первой строкой функции обработчика щелчков:

 btn.onclick=function(){
  diverr.innerHTML="";
  // the rest of the function
}
 

Комментарии:

1. я пробовал это раньше, я нахожусь на курсе, где у них есть свои редакторы, и когда я нажимаю кнопку проверить код, там говорится, что мой код неправильно решает проблему. и я не знаю, в чем проблема или в чем проблема.

2. @programmerjavascript: Каким образом это «неправильно решает проблему»? Когда вы пробуете это, разве это каким-то образом не работает? Если у вас есть инструктор, который ищет конкретное решение, а не просто какое-либо рабочее решение, то на самом деле это не то, в чем мы можем помочь.

3. я пытался несколькими способами протестировать программу, но я не могу понять,правильна программа или нет, вот почему я спросил здесь. можете ли вы сами составить программу, чтобы попытаться отправить ее мне ? требование таково : Если регистрация не может быть выполнена успешно, вы сможете отобразить это сообщение об ошибке, которое вы хотите. Вместо этого, если все условия выполнены, вы должны скрыть все элементы на странице, связанные с регистрацией, и отобразить в дополнительном месте любое сообщение, которое вы хотите

4. @programmerjavascript: Я обновил ваш вопрос, чтобы он был выполняемым фрагментом кода. Вы можете использовать это для наблюдения за тем, как работает ваш код. (И в рамках вашей разработки и отладки у вас действительно должен быть способ фактически выполнять и наблюдать за вашим кодом. Вы не можете просто написать код и надеяться на лучшее, вам нужно его протестировать .) Когда вы изменяете этот код, чтобы использовать это предложение, каким наблюдаемым образом это работает не так, как ожидалось?

5. у меня есть редактор. я видел свой код, я его не писал и надеюсь на лучшее, но когда я пытаюсь проверить его в редакторе курса, он показывает мне следующее : «Ваш код неправильно решает проблему. Попробуйте еще раз, пока не добьетесь успеха!» Я не знаю, что я делаю не так. я имею в виду, извините, что это не курс, мой основной язык-не английский. это вызов, у меня нет поддержки

Ответ №2:

Если вы не нашли решение, попробуйте это. Вместо этого, если вы нашли решение, пожалуйста, разместите его здесь.

 <script>
    var username = document.getElementById('username');
    var password = document.getElementById('password');
    var confirmPassword = document.getElementById('confirm-password');
    var button = document.getElementById('register-button');
    var errorMessage = document.getElementById('error-message');
    var succesMessage = document.getElementById('success-message');
    button.onclick = function passwordValidation() {
        if(username.value == "") {
            errorMessage.innerHTML = "Enter username";
        } else if(username.value != "" amp;amp; password.value == "") {
            errorMessage.innerHTML = "Enter password";
        } else if(username.value != "" amp;amp; password.value != "" amp;amp; password.value.length <8) {
            errorMessage.innerHTML = "Password must be at least 8 characters";
        } else if(username.value != "" amp;amp; password.value != "" amp;amp; password.value.length >= 8 amp;amp; confirmPassword.value == "") {
            errorMessage.innerHTML = "Confirm password";
        } else if(username.value != "" amp;amp; password.value != "" amp;amp; password.value.length >= 8 amp;amp; confirmPassword.value != "" amp;amp; confirmPassword.value != password.value) {
            errorMessage.innerHTML = "Both passwords must match";
        } else {
            document.getElementById('username-div').hidden = true;
            document.getElementById('password-div').hidden = true;
            document.getElementById('confirm-password-div').hidden = true;
            document.getElementById('register-button-div').hidden = true;
            errorMessage.innerHTML = ""; 
            succesMessage.innerHTML = "Congratulations! Account successfully created!";
        }
    }
</script>