利用JS来判断输入是否为空以及重复密码是否相同

登录页面HTML如下：

<div class="form-group has-feedback">
    <input type="text" class="form-control" placeholder="用户名" name="username" id="username">
    <span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
     <input type="password" class="form-control" placeholder="密码" name="password" id="password">
     <span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="form-group has-feedback">
     <input type="password" class="form-control" placeholder="确认密码" name="password2" id="password2">
     <span class="glyphicon glyphicon-log-in form-control-feedback"></span>
</div>
<div class="col-xs-4">
     <button type="submit" id="submit" onclick="return validate()" class="btn btn-primary btn-block btn-flat">注册</button>
</div>

Javascript代码如下

<script type="text/javascript">
                function validate() {
                    var psw1 = document.getElementById("password").value;
                    var psw2 = document.getElementById("password2").value;
                    var name = document.getElementById("username").value;
                    if (typeof name == "undefined" || name == null || name == "") {
                        window.alert("用户名不能为空！")
                        return false;
                    }
                    else {
                        if (typeof psw1 == "undefined" || psw1 == null || psw1 == "") {
                            window.alert("密码不能为空！");
                            return false;
                        }
                        else {
                            if (psw1 != psw2) {
                                window.alert("两次输入的新密码不一致！");
                                return false;
                            }
                            else {
                                window.alert("注册成功!");
                                return true;
                            }
                        }
                    }
                }
            </script>

关键在于给标签设置id，从而使得javascript代码能够通过id获得该标签的内容，进一步判断标签内容是否为空或者是否相同。

本文地址：https://blog.csdn.net/m0_37650503/article/details/107536365