[英]jQuery submit callback not working
自從我試圖弄清為什么表單驗證不起作用以來,已經有一天了。 在我看來,代碼的每個部分都很好。 基本上,我試圖在創建帳戶時驗證用戶輸入的兩個密碼是否匹配。 如果是,則運行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>
在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> ");
我測試了一下,現在可以使用了!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.