天天看點

php送出表單不跳轉,html中Form表單送出時頁面不跳轉的方法詳解

1.1 解決方案一

表單action送出資料,但頁面不跳轉,可以使用Iframe解決。

執行個體:

Form送出表單頁面不跳轉

賬戶:

密碼:

注意:Form元素的target屬性一定是指定要顯示傳回結果的iframe元素的name屬性。

Iframe元素可以放到body中的任何位置,也可以放到form元素中。

1.2 采用Ajax來實作,無重新整理技術

用javascript直接讀取input元素的值,然後放到函數中的變量讓ajax去處理。

執行個體——js serialize或serializeArray方法來序列化表單資料:

First name:

Last name:

序列化表單值$("#btn").click(function(){

var x=$("form").serializeArray();

console.log(x); //執行結果:[{name: "FirstName", value: "Bill" },{name: "LastName", value: "Gates" }]

var y=$("form").serialize();

console.log(y); //執行結果:FirstName=Bill&LastName=Gates

});

注意:serializeArray()方法會傳回一個json值,而serialize()方法則會傳回一個string值。