淺析onsubmit校驗表單時利用ajax的return false無效問題
更新時間：2013年07月10日 11:29:19 作者：
前幾天，在校驗一個表單數(shù)據(jù)用到ajax時，遇到 return false 無效問題,以下就是對這個問題進行了分析介紹，需要的朋友可以參考下
復(fù)制代碼 代碼如下:
/**
* 表單提交校驗
**/
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默認(rèn)的設(shè)置值為true，這種情況為異步方式，就是說當(dāng)ajax發(fā)送請求后，在等待server端返回的這個過程中，前臺會繼續(xù) 執(zhí)行ajax塊后面的腳本，直到server端返回正確的結(jié)果才會去執(zhí)行success，也就是說這時候執(zhí)行的是兩個線程，ajax塊發(fā)出請求后一個線程 和ajax塊后面的腳本（另一個線程）。
修改后的代碼：
復(fù)制代碼 代碼如下:
/**
* 表單提交校驗
**/
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)文章
Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它簡潔靈活，使得 Web 開發(fā)更加快捷。這篇文章主要介紹了Bootstrap的核心——柵格系統(tǒng)的使用,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了基于Jquery實現(xiàn)焦點圖淡出淡入效果，需要的朋友可以參考下2015-11-11
實例詳解jQuery結(jié)合GridView控件的使用方法
這篇文章主要以實例的方式詳細介紹了jQuery結(jié)合GridView控件的使用方法，感興趣的小伙伴們可以參考一下2016-01-01
這篇文章主要介紹了EasyUI中在表單提交之前進行驗證的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-07-07
jQuery基礎(chǔ)框架:原型模式結(jié)構(gòu)、返回選擇器實例、訪問原型方法、自執(zhí)行匿名函數(shù)詳細介紹，需要了解的朋友可以參考下2012-12-12
這篇文章主要介紹了基于Jquery代碼實現(xiàn)手風(fēng)琴菜單，代碼簡單易懂，需要的朋友參考下2015-11-11
使用jQuery實現(xiàn)dropdownlist的聯(lián)動效果(sharepoint 2007)
在sharepoint 2007網(wǎng)站中，使用jQuery實現(xiàn)dropdownlist的聯(lián)動效果.2011-03-03
jQuery插件echarts設(shè)置折線圖中折線線條顏色和折線點顏色的方法
這篇文章主要介紹了jQuery插件echarts設(shè)置折線圖中折線線條顏色和折線點顏色的方法,結(jié)合實例形式分析了jQuery圖表插件echarts設(shè)置折線圖的相關(guān)操作技巧,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了jQuery找出網(wǎng)頁上最高元素的方法,實例分析了jQuery遍歷元素與獲取元素高度的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)文章收起與展開功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08