javascript - 多个 if 子句的单个 else 子句 - javascript

Question

首先:我是 JavaScript 新手。 所以.. 我有密码、重复密码、电子邮件和重复电子邮件字段的基本表格。我想检查密码是否等于重复密码。如果不是，则会出现警告消息并重新加载页面。电子邮件和重复电子邮件相同。 但是如果密码和重复密码不相等并且电子邮件和重复电子邮件不相等，则会出现第一条警告消息，然后第二条消息(这次是电子邮件)出现得太快。当两个字段不匹配时，我只想显示一条警告消息。

<script type="text/javascript">

           function checkFields() {
            var pass= document.getElementById('password');
            var reppass= document.getElementById('reppass');

            var email= document.getElementById('email');
            var repemail= document.getElementById('repemail');

            if (pass.value != reppass.value) {
               alert('Passwords dont match');
               window.location.reload();
            }

            if (email.value != repemail.value) {
                alert('Emails dont match');
                window.location.reload();
            }                   

            else if (pass.value != reppass.value && email.value != repemail.value) {
                alert('Both fields dont match');
                window.location.reload();
            }

        }   

  </script>

和形式:

<form onSubmit="checkFields()">
<p><label>Password:</label> <input name="password" id="password" required="true" type="password" /></p>
<p><label>Repeat password:</label> <input name="reppass" id="reppass" required="true" type="password" /></p> 
<p><label>Email:</label> <input name="email" id="email" required="true" type="email" /></p>
<p><label>Repeat Email:</label> <input name="repemail" id="repemail" required="true" type="email" /></p>
<p><input type="submit" value="Send"></p> 
</form>

Answer 1

你可以像这样简单地从 if 子句中返回:

function checkFields() {
    var pass = document.getElementById('password');
    var reppass = document.getElementById('reppass');

    var email = document.getElementById('email');
    var repemail = document.getElementById('repemail');

    if (pass.value != reppass.value && email.value != repemail.value) {
        alert('Both fields dont match');
        window.location.reload();
    }

    if (pass.value != reppass.value) {
        alert('Passwords dont match');
        window.location.reload();
        return;
    }

    if (email.value != repemail.value) {
        alert('Emails dont match');
        window.location.reload();
        return;
    }

}

我喜欢这种风格，因为它可以防止嵌套 if 子句。缺点是，您有多个返回点，这可能会造成混淆 - 这在很大程度上取决于函数的长度。

编辑

if block 的更新顺序