淺析onsubmit校驗表單時利用ajax的return false無效問題
更新時間:2013年07月10日 11:29:19 作者:
前幾天,在校驗一個表單數(shù)據(jù)用到ajax時,遇到 return false 無效問題,以下就是對這個問題進行了分析介紹,需要的朋友可以參考下
復制代碼 代碼如下:
/**
* 表單提交校驗
**/
function onSubmit(){
if($('#name').val().length<2){
alert("名稱請不少于兩個漢字");
return false;
}
var t = new Date().getTime();
$.ajax({
type: "POST",
url: "/users/checkrepeat/",
data: "name=" + $('#name').val() + "&time=" + t,
success:function(res){
if(res == 'exists'){
alert("名稱已存在,請修改.");
return false;
}
}
});
}
問題原因:
1. ajax時return false 的function與onsubmit()不是同一個函數(shù);
2. 在ajax執(zhí)行時,async默認的設(shè)置值為true,這種情況為異步方式,就是說當ajax發(fā)送請求后,在等待server端返回的這個過程中,前臺會繼續(xù) 執(zhí)行ajax塊后面的腳本,直到server端返回正確的結(jié)果才會去執(zhí)行success,也就是說這時候執(zhí)行的是兩個線程,ajax塊發(fā)出請求后一個線程 和ajax塊后面的腳本(另一個線程)。
修改后的代碼:
復制代碼 代碼如下:
/**
* 表單提交校驗
**/
function onSubmit(){
if($('#name').val().length<2){
alert("名稱請不少于兩個漢字");
return false;
}
var flag = true;
var t = new Date().getTime();
$.ajax({
type: "POST",
async:false, // 設(shè)置同步方式
cache:false,
url: "/users/checkrepeat/",
data: "name=" + $('#name').val() + "&time=" + t,
success:function(res){
if(res == 'exists'){
alert("名稱已存在,請修改.");
flag = false;
}
}
});
if(!flag)
return false;
相關(guān)文章
jQuery+ajax實現(xiàn)無刷新級聯(lián)菜單示例
這篇文章主要介紹了jQuery+ajax實現(xiàn)無刷新級聯(lián)菜單示例,代碼很完整,也非常實用,有需要的小伙伴可以參考下。2015-05-05jQuery中clone()函數(shù)實現(xiàn)表單中增加和減少輸入項
這篇文章給大家介紹了jQuery中clone()函數(shù)實現(xiàn)表單中增加和減少輸入項的實例代碼,非常不錯,具有參考借鑒價值,需要的朋友參考下吧2017-05-05jquery bind(click)傳參讓列表中每行綁定一個事件
用jquey bind 點擊事件時,傳參不注意可能會導致點擊每一行都是顯示相同內(nèi)容的情況,下面有個示例,感興趣的朋友可以參考下2014-08-08jqGrid翻頁時數(shù)據(jù)選中丟失問題的解決辦法
我在項目中使用jqGrid時,采用異步加載服務(wù)器數(shù)據(jù),例如點擊翻頁、搜索時都重新加載數(shù)據(jù)。這篇文章主要介紹了jqGrid翻頁時數(shù)據(jù)選中丟失問題,需要的朋友可以參考下2017-02-02