JQuery.form.js插件的簡單使用
其實就是用ajax提交表單,但是不想讓他跳轉頁面所以選用ajax提交表單。我也不知道為什麼,難道是因我裡面的數據太多了?不應該啊。。。總之我的表單沒有序列化的功能!對,就是這樣。所以我就選用了人家的小插件
導入jqery.form.js後
var options = {
beforeSubmit: beforeCheck,
success: successfun,
dataType: "json",
resetForm: true,
clearForm:false,
//timeout: 10000 //限制請求的時間,當請求大於3秒後,跳出請求
};
function beforeCheck(formData,jqForm,optionds) {
var queryString = $.param(formData);
var formElement = jqForm[0];
var scoreProfit = formElement.scoreProfit.value;
//var reg = "((-1|0|[0-9]|[1-8][1-9]|9[0-2]|10000)(\,))*(-1|0|[0-9]|[1-8][1-9]|9[0-2]|10000)";
if(scoreProfit==null){
alert("評分不能為空!");
return false;
}
return true;
}
function successfun(response) {
console.log(response);
if(response.result=="ok"){
alert("添加成功~");
}else if(response.result=="fail"){
var goodsId = response.errmsg;
alert("添加失敗!失敗原因是商品編號為: "+goodsId+" 的商品已經添加過!");
}
}
$("#form").ajaxForm(options);
$(this).ajaxSubmit(function(){
return false;
});
雖然我也沒有對錶單進行序列化嘻嘻 簡單的貼下代碼吧
API
ajaxForm 增加所有需要的事件監聽器,為ajax提交表單做準備。ajaxForm並不能提交表單。在document的ready函數中,使用ajaxForm來為ajax提交表單進行準備。 接受0個或1個參數。參數可以是一個回調函數,也可以是一個Options對象。 $("#formid").ajaxForm();
ajaxSubmit 使用ajax提交表單。 接受0個或1個參數。參數可以是一個回調函數,也可以是一個Options對象。
$("#formid").ajaxSubmit();
或
$("#formid").submit(function(){
$(this).ajaxSubmit();
return false;
});
formSerialize 將表單串列化(或序列化)為一個查詢字元串。這個方法將返回以下格式的字元串:name1=value1&name2=value2。 無 $("#formid").formSerialize();
fieldSerialize 將表單的欄位元素串列化(或序列化)為一個查詢字元串。當只有部分表單欄位需要進行串列化(或序列化)時,使用這個就很方便了。返回以下格式的字元串:name=value1&name2=value2。 無 $("#formid .specialFields").fieldSerialize();
fieldValue 返回匹配插入數組中的表單元素值。該方法以數組的形式返回數據。如果元素值被判定可能無效,則數組為空。 無 $("#formid :password").fieldValue();
resetForm 將表單恢復到初始狀態。 無 $("#formid").resetForm();
clearForm 清除表單元素。該方法將所有的text、password、textarea置空,清除select元素中的選定,以及所有radio按鈕和checkbox按鈕重置為非選定狀態。 無 $("#formid").clearForm();
clearFields 清除欄位元素。只有部分表單元素需要清除時方便使用。 無 $("#formid .specialFields").clearFields();
Options對象
ajaxForm和ajaxSubmit都支持眾多的選項參數,這些選項參數可以使用一個Options對象來提供。
target 指明頁面中由伺服器響應進行更新的元素。元素的值可能被指定為一個jQuery選擇器字元串、一個jquery對象、一個DOM元素。 默認值:null
url 指定提交表單數據的URL。 默認值:表單的action屬性值
type 指定提交表單數據的方法(method):「GET」或「POST」。 默認值:GET
beforeSubmit 表單提交前被調用的回調函數。如果回調函數返回false表單將不被提交。回調函數帶三個調用參數:數組形式的表單數據,jQuery表單對象,以及傳入ajaxForm/ajaxSubmit中的Options對象。 默認值:null
success 表單成功提交後調用的回調函數。然後dataType選項值決定傳回responseText還是responseXML的值。 默認值:null
dataType 返回的數據類型:null、"xml"、"script"、"json"其中之一。 默認值:null
resetForm 表示如果表單提交成功是否進行重置。 默認值:null
clearForm 表示如果表單提交成功是否清除表單數據。 默認值:null
※jsx遇到template-directive
※並發編程之AQS(AbstractQueuedSynchronizer)
TAG:程序員小新人學習 |