1. 程式人生 > >JQuery呼叫Ajax使用Submit方法後臺無法接受到傳送的form表單

JQuery呼叫Ajax使用Submit方法後臺無法接受到傳送的form表單

在使用jQuery呼叫ajax向後臺傳送資料的時候
如果我們的事件發生的標記是點選了submit按鈕
或許會發生後臺無法接受到傳遞的form表單的情況

這是因為在web中點選submit按鈕時
會觸動submit中的一個固定方法
其效果就是通過form的action傳遞表單重新整理頁面
當然這個傳遞並不是通過ajax來實現的
可以理解為是使用jsp來實現的

而我們使用jQuery呼叫ajax傳遞form表單資料的過程是在點選了submit按鈕之後的
在傳遞之前我們的頁面就會被重新整理

我們可以重寫這個固定方法
使其不通過action來傳遞form表單資料

當然也可以通過將submit按鈕改為button亦或者其他元素來實現
以此來繞開submit

示例程式碼:

<input value="註冊" id="user_register_button" class="button2" type="button" onclick="ajax_user_register()" />



    function ajax_user_register() {

        var flag;

//      document.write("<script language=javascript src='check-username.js'></script>");
        var username = document.getElementById("user_register_username"
).value; // flag = check_username(username); // if(flag = false) {} // document.write("<script language=javascript src='check-contact.js'></script>”); var contact = document.getElementById("user_register_contact").value; // flag = check_contact(contact); // if(flag = false) {
// // } else if(contact.indexOf('@') > 0) { var mobilephone = 'null'; var email = contact; } else { var mobilephone = contact; var email = 'null'; } // document.write("<script language=javascript src='check-password.js'></script>”); var password = document.getElementById("user_register_password").value; // var ensurepassword = $("#user_register_ensurepassword"); // if(flag = false) {} $.ajax({ url: "../MedicatedDietHallServlet", //要請求的伺服器url data: { username: username, email: email, mobilephone: mobilephone, password: password, way: "user_register" }, async: true, cache: false, type: "GET", dataType: "json", success: function(result) { if(result) { location.reload(true); } else { alert("你的使用者名稱已被註冊"); } }, erroe: function(){ alert("連線伺服器或返回資料失敗") } }) }