熱點推薦:
您现在的位置: 電腦知識網 >> 編程 >> Java編程 >> JSP教程 >> 正文

淺析onsubmit校驗表單時利用ajax的return false無效問題

2022-06-13   來源: JSP教程 
前幾天在校驗一個表單數據用到ajax時遇到 return false 無效問題以下就是對這個問題進行了分析介紹需要的朋友可以參考下   復制代碼 代碼如下:
/**
 * 表單提交校驗
 **/
function onSubmit(){
    if($(#name)val()length<){
        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;
            }
        }
    });
}

  
問題原因
ajax時return false 的function與onsubmit()不是同一個函數;
在ajax執行時async默認的設置值為true這種情況為異步方式就是說當ajax發送請求後在等待server端返回的這個過程中前台會 繼續 執行ajax塊後面的腳本直到server端返回正確的結果才會去執行success也就是說這時候執行的是兩個線程ajax塊發出請求後一個線程 和ajax塊後面的腳本(另一個線程)

修改後的代碼

復制代碼 代碼如下:

  
/**
 * 表單提交校驗
 **/
function onSubmit(){
    if($(#name)val()length<){
        alert("名稱請不少於兩個漢字");
        return false;
    }   
    var flag = true;
    var t = new Date()getTime();
    $ajax({
        type: "POST"
        async:false  // 設置同步方式
        cache:false
        url: "/users/checkrepeat/"
   data: "name=" + $(#name)val() + "&time=" + t
        success:function(res){
            if(res == exists){
                alert("名稱已存在請修改");
                flag = false;
            }
        }
    });
    if(!flag)
        return false;


From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19889.html
    推薦文章
    Copyright © 2005-2022 電腦知識網 Computer Knowledge   All rights reserved.