在日常开发的过程中,难免会用到form表单,我们需要获取表单的数据保存到数据库,或者拿到后台的一串json数据,要将数据绑定到form表单上,这里我写了一个基于jquery的,formHelp插件,使用起来也很简单:
获取表单的数据:$("#formid").serializeJson();
绑定数据到表单:$("#formid").setForm(json);
jquery.formHelp.js插件
rush:js;">
/**
* 将form里面的内容序列化成json
* 相同的checkBox用分号拼接起来
* @param {dom} 指定的选择器
* @param {obj} 需要拼接在后面的json对象
* @method serializeJson
* */
$.fn.serializeJson=function(otherString){
var serializeObj={},array=this.serializeArray();
$(array).each(function(){
if(serializeObj[this.name]){
serializeObj[this.name]+=';'+this.value;
}else{
serializeObj[this.name]=this.value;
}
});
if(otherString!=undefined){
var otherArray = otherString.split(';');
$(otherArray).each(function(){
var otherSplitArray = this.split(':');
serializeObj[otherSplitArray[0]]=otherSplitArray[1];
});
}
return serializeObj;
};
/**
- 将josn对象赋值给form
- @param {dom} 指定的选择器
- @param {obj} 需要给form赋值的json对象
- @method serializeJson
- */
$.fn.setForm = function(jsonValue){
var obj = this;
$.each(jsonValue,function(name,ival){
var $oinput = obj.find("input[name="+name+"]");
if($oinput.attr("type")=="checkBox"){
if(ival !== null){
var checkBoxObj = $("[name="+name+"]");
var checkArray = ival.split(";");
for(var i=0;i<checkBoxObj.length;i++){
for(var j=0;j<checkArray.length;j++){
if(checkBoxObj[i].value == checkArray[j]){
checkBoxObj[i].click();
}
}
}
}
}
else if($oinput.attr("type")=="radio"){
$oinput.each(function(){
var radioObj = $("[name="+name+"]");
for(var i=0;i<radioObj.length;i++){
if(radioObj[i].value == ival){
radioObj[i].click();
}
}
});
}
else if($oinput.attr("type")=="textarea"){
obj.find("[name="+name+"]").html(ival);
}
else{
obj.find("[name="+name+"]").val(ival);
}
})
}
html测试代码
rush:xhtml;">
Meta charset="UTF-8">
jQueryFormHelp练习
Box" name="f" value="9"/>
王
小
以上就是jquery获取form表单内容以及绑定数据到form表单的全部内容,希望对大家的学习有所帮助。
原文地址:https://www.jb51.cc/jquery/49978.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。