輸入按鈕不能在Jquery表格上工作

我在我的所有代碼中使用以下或類似的設置。我意識到，如果你跳過所有字段，只輸入最後一個字段，不管最後一個字段是什麼..表單提交..我想阻止表單提交，如果細節（標誌爲1）輸入按鈕不能在Jquery表格上工作

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>JS</title> 
</head> 
<body> 

<form name="m2mform" id="m2mform" method="post" onsubmit="return form()" > 
u:<input id="user" name="user" type="text" value=""> 
email:<input id="email" name="email" type="text" value=""> 
<input class="submitx" type="button" onClick="javascript:form();"/> 

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
flag = 1; 
function form() { 
    if (document.getElementById("user").value == "") { 
     // slidedown some red css 
     flag = 1; 
    } else { 
     // dont show red css 
     flag = 0; 
    } 
    if (document.getElementById("email").value == "") { 
     // slidedown some red css 
     flag = 1; 
    } else { 
     // dont show red css 
     flag = 0; 
    } 
    if (flag == 1) { 
     // dont submit form 
    } 
    else { 
     var submitForm; 
     submitForm = document.getElementById("m2mform"); 
     submitForm.submit(); 
    } 
} 
</script> 
</body> 
</html>

更新了另一個嘗試：

var flag = 0; 
function nValidateForm() { 
    var flag = 0; 
    if (document.getElementById("fullname").value == "") { 
     $('#fullnamefail').slideDown("fast"); 
     flag = 1; 
    } 
    else { 
     $('#fullnamefail').slideUp("fast"); 
     flag = 0; 
    } 

    if (flag == 1) { 
     $('#error').fadeIn('slow'); 
     return false; 
    } 
    else { 
     var custForm; 
     custForm = document.getElementById("m2mform"); 
     custForm.submit(); 
    } 
}

來源

2011-11-17 TheBlackBenzKid

你的邏輯是有缺陷的。如果已經升高（等於1），則不得降低標誌（更改爲0）。另外，你不應該直接再次調用submit()，只是返回true或者false。

修復以最小的改變你原來的代碼：

flag = 0; //lower by default 
if (document.getElementById("user").value == "") { 
    // slidedown some red css 
    flag = 1; 
} else { 
    // dont show red css 
} 

if (document.getElementById("email").value == "") { 
    // slidedown some red css 
    flag = 1; 
} else { 
    // dont show red css 
} 
if (flag == 1) { 
    // dont submit form 
    return false; 
} 
else { 
    return true; 
}

這僅僅是一個標誌設置爲0只有一次，在上面，任何驗證錯誤導致的標誌得到提升。

這是可行的，但你已經在使用jQuery考慮使用它的力量..只是谷歌「jQuery的表單驗證」的功能非常強大和簡單的方法來驗證用戶輸入。

來源

2011-11-17 11:30:03

你忘記了，這將在遞歸結束，如'的onsubmit =「申報單（）」'將調用方法'form'，它調用'submitForm.submit（）'再次調用的onsubmit處理程序... –

謝謝@Andreas我沒有注意到他稱之爲函數的方式。 –

我把這個答案標記爲OK。我的新JS代碼：http：//www.gc-cdn.com/assets/js/m2m_c.js我的新頁面：http：//www.gorgeouscouture.com/new.m2m.php - 但是將來我會使用上面的代碼，因爲它們是真的jQuery – TheBlackBenzKid

你在這裏缺少一個return false; ......和喜歡使用type="submit"代替type="button"（你不需要申報的form()的方法調用兩次，如果你正確使用submit）

例如用button類型：

<form method="post" onSubmit="return form();"> 
    u:<input id="user" type="text" value=""><br /> 
    email:<input id="email" type="text" value=""><br /> 
    <input id="submit" type="button" value="submit" onClick="window.submitFromButton();" /> 
</form> 
<script type="text/javascript"> 
window.form = function(sender) { 
    var $user = $('#user'); 
    var $email = $('#email'); 
    $user.css('background-color', 'white'); 
    $email.css('background-color', 'white'); 
    var submitTheForm = true; 
    if (!$user.val()) { 
     $user.css('background-color', 'red'); 
     submitTheForm = false; 
    } 
    if (!$email.val()) { 
     $email.css('background-color', 'red'); 
     submitTheForm = false; 
    } 
    return submitTheForm; 
}; 
window.submitFromButton = function() { 
    var $form = $('form'); 
    $form.submit(); 
} 
</script>

看到我的工作示例here
看到我的工作示例與風格here
看到類型我的工作示例buttonhere

來源

2011-11-17 11:02:02

nope。看到更新的代碼。第2版，仍然沒有工作 – TheBlackBenzKid

加上這不是feesable作爲回報虛假的，所有如果最終塊是行不通返回true - 這是全碼：http://www.gc-cdn.com/assets/js/m2m_c .js – TheBlackBenzKid

@TheBlackBenzKid看到我的第二個工作示例！ –

要取消事件觸發，你需要到return false;當你不希望提交您的形式你form()功能：

<input class="submitx" type="button" onClick="javascript:form();"/> 

function form() { 

    ....  

    if (flag == 1) { 
     return false; // this will cancel the click event firing on the submit button 
    } 
    else { 
     var submitForm; 
     submitForm = document.getElementById("m2mform"); 
     submitForm.submit(); 
    } 
}

來源

2011-11-17 11:05:01

我試過了，看上面的代碼。 – TheBlackBenzKid

輸入按鈕不能在Jquery表格上工作

回答

相關問題