[英]input form does not work when call it from jquery ajax
對不起,但如果我問一個荒謬的問題,我完全是ajax和jQuery的新手。
基本上我的形式如下;
<form id="login_form" >
<input type="text" id="inputEmail" name="username">
<input type="password" id="inputPassword" name="password">
<div id="MyDynamicDiv"></div>
<button id="signin" name="signin" type="submit">button</button>
</form>
<script>
$("#login_form").submit(function() {
if ($("#login_form").valid()) {
$('.messagebox').slideUp('slow');
var data1 = $('#login_form').serialize();
$("button").button('loading');
$.ajax({
type: "POST",
url: "login/login.php",
data: data1,
dataType: 'json',
success: function(msg) {
if (msg.result == 12) {
$('#MyDynamicDiv').load('captcha.php');
}
if (msg.result == 1) {
$('.messagebox').addClass("success-message");
$('.message').slideDown('slow');
$('#alert-message').text("....");
$('#login_form').fadeOut(5000);
window.location = "members.php"
} else { return false;}
</script>
我的captcha.php是
<input type="text" name="captcha_code">
<img id="captcha" src="/test/securimage/securimage_show.php">
<a href="#" id="captcha_link" onclick="document.getElementById('captcha').src = '/test/securimage/securimage_show.php?' + Math.random(); return false">[ Different Image]</a>
還有login / login.php包括
echo json_encode( array('result'=>12));
我可以調用captcha.php並顯示在頁面上但是,表單不適用於驗證碼輸入。 我應該以不同的方式打電話給我,我無法找到我應該做的事情。
編輯:似乎captcha_code的輸入值沒有正確發送/發布。 如果我使用嵌入登錄表單的captcha.php代碼,那么它的工作原理。 提前致謝,
您的驗證碼輸入似乎在<form>
元素之外,因此在serialize()
表單時它不會包含在POST數據中。 在form元素內移動輸入。
你似乎錯過了一些右括號和括號。
從success函數return false
不會因為異步性質而無效。 相反,您應該從提交事件返回false,或者防止默認。
使用注釋更改更正代碼(假設您已移動驗證碼輸入):
$("#login_form").submit(function (e) { // capture event
e.preventDefault(); // always prevent the form from submitting
if ($("#login_form").valid()) {
$('.messagebox').slideUp('slow');
var data1 = $('#login_form').serialize();
$("button").button('loading');
$.ajax({
type: "POST",
url: "login/login.php",
data: data1,
dataType: 'json',
success: function (msg) {
if (msg.result == 12) {
$('#MyDynamicDiv').load('captcha.php');
}
if (msg.result == 1) {
$('.messagebox').addClass("success-message");
$('.message').slideDown('slow');
$('#alert-message').text("....");
$('#login_form').fadeOut(5000);
window.location = "members.php"
}
} // was missing
}); // was missing
} // was missing
}); // was missing
為了將來的調試,請記住檢查控制台(F12)是否有錯誤,並縮進代碼,因為它會使支撐缺失更明顯。 您可以使用JSFiddle的TidyUp功能自動縮進它。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.