JavaScript - неверная логика в простой проверке данных - PullRequest
Новая
       5

JavaScript - неверная логика в простой проверке данных

0 голосов
/ 07 сентября 2018

Я очень новичок в кодировании и испытываю трудности с некоторыми логиками. Вчера вечером я задал еще один вопрос, и сообщество было очень полезно (спасибо!), Поэтому я подумал, что попробую еще раз `

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

Я определил "var errorMessage =" ";" и если в любой момент возникает ошибка, она переопределяет новое сообщение errorMessage, основываясь на ошибке, которую пользователь сделал в форме.

Проблема, я думаю, связана со вторым оператором if-else. Я думал, что если "errorMessage =" ";" Тем не менее, он будет отправлять форму. Однако, независимо от того, что он выполняет оператор else, я получаю предупреждение о пустом сообщении об ошибке.

Почему, если errorMessage = "", он выполняет оператор else и пропускает оператор if, который использует errorMessage = "" в качестве условия? 

"use strict";

var $ = function(id) {
    return document.getElementById(id);
};

var joinList = function() {
    var emailAddress1 = $("email_address1").value;
    var emailAddress2 = $("email_address2").value;	
    var firstName = $("first_name").value;
    var errorMessage = "";

    // validate the entries
    if (emailAddress1 == "") {
    	errorMessage = "First email address entry required";
        $("email_address1").focus();
    } else if (emailAddress2 == "") {
    	errorMessage = "Second email address entry required";
    	$("email_address2").focus();
    } else if (emailAddress2 != emailAddress1) {
    	errorMessage = "Email address entries must match";
    	$("email_address2").focus();
    } else if (firstName == "") {
    	errorMessage = "First name entry required";
    	$("first_name").focus();
    }

    // submit the form if all entries are valid
    // otherwise, display an error message
    if (errorMessage = "") {
        $("email_form").submit(); 
    } else {
    	alert(errorMessage);
    }
};

window.onload = function() {
    $("join_list").onclick = joinList;
    $("email_address1").focus();
};
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">	
    <title> Join Email List</title>
    <link rel="stylesheet" href="email_list.css">
    <script src="email_list.js"></script>
</head>
<body>
    <main>
        <h1>Please join our email list</h1>
        <form id="email_form" name="email_form" action="join.html" method="get">
            <label for="email_address1">Email Address:</label>
            <input type="text" id="email_address1" name="email_address1"><br>

            <label for="email_address2">Re-enter Email Address:</label>
            <input type="text" id="email_address2" name="email_address2"><br>

            <label for="first_name">First Name</label>
            <input type="text" id="first_name" name="first_name"><br>

            <label>&nbsp;</label>
            <input type="button" id="join_list" value="Join our List">
        </form>
    </main>
</body>
</html>

**

Ответы [ 2 ]

0 голосов
/ 07 сентября 2018

Я не уверен, что вы можете извлечь значения из входных данных таким способом. email_address1 - это идентификатор элемента, поэтому вы должны ссылаться на него с хэштегом в начале. Правильный способ сделать это в jQuery $ ("# email_address1"). Val ()

Разница между = , == и === весьма важна. 

let testVariable = 123; // only assigns value to a variable

Разница между = и == совершенно очевидна. Между == и === немного сложнее.

Оператор

== сравнивает только значения и не распознает типы данных, но === распознает их. Что это значит для вас?

Допустим, у вас есть переменная testNumber с присвоенным значением 123 в качестве числа и переменной textText с присвоенным значением "123" (обратите внимание на кавычки).

Если вы сравните их с == , выражение вернет true, но если вы сравните их с === , выражение вернет false. 

let testNumber = 123;
let testText = "123";

Как видите, переменная testText указана в двойных кавычках, что означает, что ее тип данных String . Строка это просто обычный текст. Но переменная testNumber имеет тип данных Integer. Целое число - просто нормальное число. Содержание этих двух переменных не отличается, но типы данных различаются. 

testNumber == testText //true - same content, different datatype we ignore that
testNumber === testTExt // false - same content, different datatype but now we consider it

Я надеюсь, что помог вам хоть немного. :)

Редактировать: Также я предлагаю вам открыть инструменты разработчика (F12) в Chrome и проверить консоль. Вы можете увидеть ошибки там. Это вам очень помогает.

0 голосов
/ 07 сентября 2018

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

Итак, ваш код в основном такой: 

errorMessage = "";
if (errorMessage) {
} else {
}

Использование таких инструментов, как jshint, jslint, eslint и т. Д., Встроенных в вашу IDE, поможет вам поймать эти опечатки. Поэтому измените свой код, чтобы сделать правильное сравнение. 

if (errorMessage === "") {
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...