Question

我是编码的新手，有些逻辑很难。昨晚我问了另一个问题，社区真的很有帮助（谢谢！），所以我想我会再试一次。 `

我正在尝试制作一个程序来收集用户的电子邮件和名字。我要检查是否在表单的每个框中输入了某些内容，并且为了确保他们正确输入了电子邮件地址，emailAddress1与emailAddress2相同。

我已经定义了“ var errorMessage =“”;“如果在任何时候出现错误，它都会根据用户在表单上犯的错误重新定义一个新的errorMessage。

我认为问题出在第二条if-else语句上。我以为如果“ errorMessage =”“;”仍然会提交表格。但是，无论它执行else语句是什么，我都会收到有关空错误消息的警报。

为什么，如果errorMessage =“”，它将运行else语句并跳过使用errorMessage =“”作为条件的if语句吗？

"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>

**

Answer 1

因此，您的代码中有一个拼写错误，您没有在进行比较，因此您将变量设置为一个空字符串。空字符串是falsy value

所以您的代码基本上就是这个

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

在IDE中使用jshint，jslint，eslint等工具可帮助您捕获这些错别字。因此，请更改您的代码以进行正确的比较。

if (errorMessage === "") {

Answer 2

我不确定是否可以通过这种方式从输入中提取值。 email_address1 是元素ID，因此您必须在开头加上＃号。在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

希望我至少能对您有所帮助。：）

编辑：另外，我建议您在chrome中打开开发人员工具（F12）并检查控制台。您可以在那里看到错误。它对您有很大帮助。

JavaScript-简单数据验证中的错误逻辑

2 个答案: