欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 编程资源 > 编程问答 >内容正文

编程问答

ajax无刷新方式对form表单进行赋值!

发布时间:2025/6/15 编程问答 49 豆豆
生活随笔 收集整理的这篇文章主要介绍了 ajax无刷新方式对form表单进行赋值! 小编觉得挺不错的,现在分享给大家,帮大家做个参考.
/*** 把json数据填充到from表单中*/ <form id="editForm" action="user.php">用户名:<input type="text" name="usrname" /><br/>地址:<input type="text" name="address" /><br/>性别:<input type="radio" name="sex" value="0" />&nbsp;
     <input type="radio" name="sex" value="1" /><br/>爱好:<input type="checkbox" name="hobby[]" value="sing" />唱歌&nbsp;<input type="checkbox" name="hobby[]" value="code" />写代码&nbsp;<input type="checkbox" name="hobby[]" value="trance" />发呆
</form>

以下是JS方法用于对form表单进行赋值(通用方法)

$.fn.formEdit = function(data){return this.each(function(){var input, name;if(data == null){this.reset(); return; }for(var i = 0; i < this.length; i++){ input = this.elements[i];//checkbox的name可能是name[]数组形式name = (input.type == "checkbox")? input.name.replace(/(.+)\[\]$/, "$1") : input.name;if(data[name] == undefined) continue;switch(input.type){case "checkbox":if(data[name] == ""){input.checked = false;}else{//数组查找元素if(data[name].indexOf(input.value) > -1){input.checked = true;}else{input.checked = false;}}break;case "radio":if(data[name] == ""){input.checked = false;}else if(input.value == data[name]){input.checked = true;}break;case "button": break;default: input.value = data[name];}}}); };

调用方式:

$json = { "usrname":"张三", "address":"湖北钟祥", "sex": "1", "hobby":["sing", "trance"]};

$('#editForm').formEdit($json);

调用代码解释说明:

$(form表单).formEdit(json数据);
json数据说明:基本格式{inputname: value}, 具体类型{"text":"aaa", "checkbox":[1,2,3], "radio":"10"}

总结

以上是生活随笔为你收集整理的ajax无刷新方式对form表单进行赋值!的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。