Control jquery.fn.ajaxform

定義于文件：??jquery.form.js

允許你輕易的提交表單。

基本語法

$('#myFormId').ajaxForm();

參數(shù)說明

• target?: String
• (可選參數(shù))更新到服務(wù)器響應(yīng)的元素標識符，這個值可以指定為一個JQUERY選擇器字符串，一個JQUERY對象，或一個DOM元素。
• url?: String
• (可選參數(shù))將要提交form數(shù)據(jù)URL，默認值：form動作屬性。
• type?: String
• (可選參數(shù))'get' 或 'post'，override for form's 'method' attribute
• dataType?: String
• (可選參數(shù)) 'xml', 'script', or 'json' (期待服務(wù)器響應(yīng)類型)
• clearForm?: boolean
• (可選參數(shù)) true，提交成功后清除表單所有字段
• resetForm?: boolean
• (可選參數(shù)) 提交成功后重置表單.
• beforeSubmit?: function
• (可選參數(shù)) 提交前的callback
• success?: function
• (可選參數(shù)) 提交成功后的callback
• semantic?: boolean
• (可選參數(shù)) 是否嚴格語義提交
• iframe?: null
• (可選參數(shù)) 是否表單提交target總是iframe.
• timeout?: number
• (可選參數(shù)) 超時

依賴關(guān)系

jquery.js

相關(guān)方法

相關(guān)方法	所屬類
fieldValue() 返回匹配元素的值到一個數(shù)組	jquery.ajaxform
ajaxSubmit([option]) 通過增加所有需要事件監(jiān)控器 實現(xiàn)ajax提交表單

--------------------------------------------------------------------------------------------------

HTML代碼：

<form method="post" action="" id="ajaxform">
????????????<div class="bbit-form bbit-infocontainer">
????????????????<h3>
????????????????????人員信息登記</h3>
????????????????<ul>
????????????????????<li>
????????????????????????<label for="name">
????????????????????????????姓名</label>
????????????????????????<input type="text" id="name" name="name"></li>
????????????????????<li>
????????????????????????<label>
????????????????????????????性別</label>
????????????????????????<input type="radio" id="gender_0" value="男" name="gender">
????????????????????????<label for="gender_0">
????????????????????????????男</label>
????????????????????????<input type="radio" id="gender_1" value="女" name="gender">
????????????????????????<label for="gender_1">
????????????????????????????女</label>
????????????????????</li>
????????????????????<li>
????????????????????????<label for="birthday">
????????????????????????????生日</label>
????????????????????????<input type="text" maxlength="10" readonly="readonly" name="birthday" style="width: 100px;" id="birthday" class="bbit-dp-input"><img align="middle" alt="" src="/themes/shared/images/s.gif" class="picker">
????????????????????</li>
????????????????????<li>
????????????????????????<label for="vocation">
????????????????????????????職業(yè)</label>
????????????????????????<select id="vocation" name="vocation">
????????????????????????????<option value="PG">軟件工程師</option>
????????????????????????????<option value="PM">項目經(jīng)理</option>
????????????????????????????<option value="OA">質(zhì)量控制</option>
????????????????????????????<option value="BOSS">老板</option>
????????????????????????</select>
????????????????????</li>
????????????????????<li>
????????????????????????<label>
????????????????????????????愛好</label>
????????????????????????<label>
????????????????????????????<input type="checkbox" id="Hobbies_0" value="體育" name="hobbies">
????????????????????????????體育</label>
????????????????????????<label>
????????????????????????????<input type="checkbox" id="Hobbies_1" value="音樂" name="hobbies">
????????????????????????????音樂</label>
????????????????????????<label>
????????????????????????????<input type="checkbox" id="Hobbies_2" value="電子游戲" name="hobbies">
????????????????????????????電子游戲</label>
????????????????????</li>
????????????????????<li>
????????????????????????<label for="remark">
????????????????????????????備注</label>
????????????????????????<textarea class="bbit-textbox-TextArea" rows="6" cols="40" id="remark" name="remark"></textarea></li>
????????????????????<li>
????????????????????????<input type="submit" value="提交">
????????????????????</li>
????????????????</ul>
????????????</div>
</form>

Jquery 代碼：

//參數(shù)配置

var?o = {

dataType:?"json",

url:?"formHandler.ashx",

type:?"post",

beforeSubmit: beforeSubmit,?

success: ProcessJson

};

//調(diào)用方式

$("#ajaxform").ajaxForm(o);

// 提交前的callback函數(shù)

function?beforeSubmit(formData, jqForm, options) {

????var?queryString = $.param(formData); alert('提交之前數(shù)據(jù)被序列化成：\n\n'?+ queryString); return?true;

?

} //提交成功后的callback函數(shù) function?ProcessJson(person) { var?ret =?"服務(wù)器端接收到的數(shù)據(jù)Person類:" ret +=?"\r\nname="?+ person.name; ret +=?"\r\ngender="?+ person.gender; ret +=?"\r\nbirthday="?+ person.birthday; ret +=?"\r\nvocation="?+ person.vocation; ret +=?"\r\nhobbies="?+ person.hobbies; ret +=?"\r\nremark="?+ person.remark; alert(ret); }

轉(zhuǎn)載于:https://www.cnblogs.com/shinehouse/articles/3179416.html

總結(jié)

以上是生活随笔為你收集整理的AjaxForm的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。