jQuery提交回调不起作用

Question

自从我试图弄清为什么表单验证不起作用以来，已经有一天了。 在我看来，代码的每个部分都很好。 基本上，我试图在创建帐户时验证用户输入的两个密码是否匹配。 如果是，则运行POST方法。 如果不是，则显示警报。 但是，当我运行它时，在两种情况下（无论是否匹配密码）都没有经过任何验证。

需要在代码不起作用背后的可能原因。 这是代码：

<body>
<div class="container">
    <div class="row">
        <h2>Hi! Welcome to our JCLOUD File Sharing Service. Please singup to start uploading files</h2>
    </div>
    <div class="row" id="signup-row">
        <div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4">
            <h3>JCloud File Sharing - Signup <small></small></h3>
            <hr>

            <form action="register" method="post" id="signup-form">
                <div class="form-group">
                    <label for="username">Enter a username:</label>
                    <input type="text" class="form-control" name="username" />
                </div>
                <div class="form-group">
                    <label for="email">Enter your e-mail address:</label>
                    <input type="email" class="form-control" name="email" />
                </div>
                <div class="form-group">
                    <label for="password">Choose a password:</label>
                    <input type="password" class="form-control" name="password" id="password-value" />
                </div>
                <div class="form-group">
                    <label for="password2">Confirm password:</label>
                    <input type="password" class="form-control" name="password2" id="password-value2" />
                </div>
                <button type="submit" class="btn btn-primary btn-block">Create Account</button>

            </form>
            <p>${requestScope["message"]}</p>
        </div>
    </div>
</div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <!-- Include all compiled plugins (below), or include individual files as needed -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.min.js"></script>

        <script>

            $('#signup-form').submit(function() {

                var pass1 = $("#password-value").val();
                var pass2 = $("#password-value2").val();

                if( pass1 == pass2 ) {
                    var encrypted = CryptoJS.SHA256($("#password-value").val());
                    $("#password-value").val(encrypted);

                    var encrypted2 = CryptoJS.SHA256($("#password-value2").val());
                    $("#password-value2").val(encrypted2);

                    return true;
                }

                else{

                    $("#signup-row").before("<div class='row'>" +
                        "<div class='col-xs-12 col-sm-12 col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4'>" +
                        "<div class="alert alert-danger"><strong>Error!</strong> The passwords you entered don not match." +
                    "</div>" +
                        "<div>" +
                        "</div> ");

                    return false;

                }
            });

        </script>
</body>

Answer 1

在before函数中，您为危险div输入了双引号" 。

这是正确的语法：

 $("#signup-row").before("<div class='row'>" +
                        "<div class='col-xs-12 col-sm-12 col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4'>" +
                        "<div class='alert alert-danger'><strong>Error!</strong> The passwords you entered don not match." +
                    "</div>" +
                        "<div>" +
                        "</div> ");

我测试了一下，现在可以使用了！

http://jsfiddle.net/dfyXY/71/

jQuery提交回调不起作用

问题描述

1 个解决方案

解决方案1
1 已采纳 2017-04-25 14:35:13

jQuery提交回调不起作用

问题描述

1 个解决方案

解决方案1 1 已采纳 2017-04-25 14:35:13

解决方案1
1 已采纳 2017-04-25 14:35:13