javascript - 多个 div 的简单表单验证

Question

我有一个包含 3 个步骤的联系表单，每个步骤都有自己的“选项卡”，然后通过电子邮件 PHP 脚本提交。现场版地址为http://agoodman.com.au/wptest/menswear-porter-service/ (点击“60 秒内预订”)。

在第一个表单中，我想确保他们在继续之前输入了电子邮件地址。我已通过以下方式尝试过此操作:

<button class="btn classic" onclick=" if ('#basicdetails .email').value ='=' ' '){return false;} else {document.getelementbyid('n.2').click();}">next</button>

目前，代码确实会检查电子邮件地址，如果未输入任何内容，则会停止，但是当输入电子邮件时，表单不会继续。 (“#n.2”是一个选项卡，仅显示表单的下一页)。如果我删除 if声明并编写按钮代码:

<button class="btn classic" onclick="document.getelementbyid('n.2').click()">next</button>

然后表单将按预期进行，但显然在未输入电子邮件地址时不会停止。

我的“if/else”语法是否错误？否则，我在这里缺少什么？

编辑:

在语法上犯了一些大错误(首先尝试这种事情)，请参阅更新的代码:

<button class="btn classic" id="firstTab">next</button>

<script>
$('.btn#firstTab').click(function(){
if (('#basicdetails .email').value =='') {
  return false;
} else {
 $('#n2').click();
}
});

</script>

Answer 1

使用内联 JavaScript 从来都不是一个好主意。如果将标记与逻辑分开，您将能够更好地组织它并轻松发现错误。如果您分解代码并正确缩进，您会立即看到问题:

if ('#basicdetails .email').value ='=' ' ') {
  return false;
} else {
  document.getelementbyid('n.2').click();
}

确实存在一些问题。您的 if 语句中缺少 (。那么您需要使用比较运算符，例如 == 或 ===。= 运算符只是用于赋值。最后你可以看出这个 ='=' ' ' 看起来一团糟，根本不明显这意味着什么，加上不是有效的 JavaScript。此外，如果 ('#basicdetails .email') 是一个 jQuery 选择器您缺少括号前的 $。