;!(function ($)
{
$.fn.setFormValue = function (options)
{
var $this = $(this); $.each(options, function (key, value)
{
var obj = $this.find("*[name=" + key + "]"); if (obj.attr("type") == "checkbox")
{
if ($.type(value) === "boolean")
{
obj.attr("checked", value);
} if ($.type(value) === "object")
{
$.each(value, function (i, item)
{
$this.find("*[name=" + key + "][value=" + i + "]").attr("checked", item);
})
}
}
else if (obj.attr("type") == "radio")
{
$this.find("*[name=" + key + "][value=" + value + "]").attr("checked", true);
}
else
{
obj.val(value);
}
})
} })(jQuery)

  

使用

$("#form").setFormValue({
"input": "zsw",//input标签
"textarea": "多行文本",//多行文本
"select":"2",//选择标签
"test": {
1: true,
2: false,
3: true
},//多选框
"checkboxtest": true,//多选框2
"radiotest":"2"
})

  

html代码

<form id="form">
<div class="form-group">
<label for="exampleInputEmail1">input</label>
<input type="text" class="form-control" name="input" />
</div>
<div class="form-group">
<label for="exampleInputEmail1">input</label>
<textarea name="textarea"> </textarea>
</div>
<div class="form-group">
<label>select</label>
<select name="select">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</div>
<div class="checkbox">
<div>
<label>
<input type="checkbox" name="test" value="1">
第一个
</label>
</div>
<div>
<label>
<input type="checkbox" name="test" value="2">
第二个
</label>
</div>
<div>
<label>
<input type="checkbox" name="test" value="3">
第三个
</label>
</div>
<div>
<label>
<input type="checkbox" name="test" value="4">
第四个
</label>
</div>
</div>
<div class="checkbox">
<label>
<input type="checkbox" name="checkboxtest">
第一个
</label>
</div>
<div class="checkbox">
<label>
<input type="radio" name="radiotest" value="1">

</label>
<label>
<input type="radio" name="radiotest" value="2">

</label>
<label>
<input type="radio" name="radiotest" value="3">

</label>
</div>
<input type="button" value="确定" onclick="setValueTest()" />
</form>

  

jquery form表单赋值封装的更多相关文章

  1. 针对form表单赋值封装

    1 (function ($){ 2 $.fn.extend({ 3 exajax:function(url,opts,convert){ 4 var ajaxParam = { 5 url:url, ...

  2. jQuery Form 表单提交插件-----formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的 应用

    一.jQuery Form的其他api  1.  formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...

  3. jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址

     一.jQuery Form简介 jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxF ...

  4. Jquery form表单提交

    起因 由于项目中原先提交from是通过JavaScript指定action,在submit提交的,使用的方式,也不是很标准,造成除了ie之外的浏览器都不能正常的提交数据,做web项目还是要考虑到浏览器 ...

  5. ajax上传文件 基于jquery form表单上传文件

    <script src="/static/js/jquery.js"></script><script> $("#reg-btn&qu ...

  6. 文档驱动 —— 表单组件(六):基于AntDV的Form表单的封装,目标还是不写代码

    开源代码 https://github.com/naturefwvue/nf-vue3-ant 也不知道大家是怎么写代码的,这里全当抛砖引玉 为何封装? AntDV非常强大,效果也非常漂亮,功能强大, ...

  7. Jquery Form表单取值

    之前js取form表单的值都是一个一个的取,数量一多之后容易出错而且烦透了.感谢那些愿意分享的人. 页面定义form,并给form指定id值,里面的元素只要是需要键值对应的都赋予name属性,并且na ...

  8. jQuery Form 表单提交插件-----ajaxSubmit() 的应用

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.ajaxSubmit() 介绍  立即通过AJ ...

  9. jQuery Form 表单提交插件-----ajaxForm() 的应用

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.ajaxForm() 介绍  ajaxForm ...

随机推荐

  1. 基于 HTML5 WebGL 的智慧楼宇三维可视化监控

    前言 可视化的智慧楼宇在 21 世纪是有急迫需求的,中国被世界称为"基建狂魔",全球高层建筑数量位居首位,所以对于楼宇的监控是必不可少.智慧楼宇可视化系统更多突出的是管理方面的功能 ...

  2. 前端jQuery日历控件报错 $("#datepicker").datepicker is not a function

    使用日历控件时,前端产生错误: $("#datepicker").datepicker is not a function 问题原因 前端在同一个页面,jQuery引入了两次. 解 ...

  3. 动手学习Pytorch(4)--过拟合欠拟合及其解决方案

    过拟合.欠拟合及其解决方案 过拟合.欠拟合的概念 权重衰减 丢弃法   模型选择.过拟合和欠拟合 训练误差和泛化误差 在解释上述现象之前,我们需要区分训练误差(training error)和泛化误差 ...

  4. 异步并发利器:实际项目中使用CompletionService提升系统性能的一次实践

    场景 随着互联网应用的深入,很多传统行业也都需要接入到互联网.我们公司也是这样,保险核心需要和很多保险中介对接,比如阿里.京东等等.这些公司对于接口服务的性能有些比较高的要求,传统的核心无法满足要求, ...

  5. Python 高级网络操作 - Python Advanced Network Operations

    Python 高级网络操作 - Python Advanced Network Operations Half Open Socket, 一个单向的 socket 被称为 half open sock ...

  6. 集智学院 “Deep X:Deep Learning with Deep Knowledge”的公开讲座---总结

    人工智能旨在了解人类智能的本质,并创造出能模仿人类智能做出反应的智能机器,目前在一些领域已经取得显著的成功,如AI玩游戏.问答系统.自动驾驶.无人机.机器人.翻译.人脸识别.语音识别等领域.深度学习的 ...

  7. openssl 自签名证书SHA1加密算法

    openssl genrsa -out privkey.pem 2048 openssl req -new -key privkey.pem -sha1 -out cert.csr openssl r ...

  8. textarea 标签

    textarea 标签 -- 代表HTML表单多行输入域 textarea标签是成对出现的,以<textarea>开始,以</textarea>结束 属性: Common -- ...

  9. Spring(七)核心容器 - 钩子接口

    目录 前言 1.Aware 系列接口 2.InitializingBean 3.BeanPostProcessor 4.BeanFactoryPostProcessor 5.ImportSelecto ...

  10. 学习了解CSS3发展方向和CSS样式与优先级

    通过学习CSS3游戏介绍.CSS样式和优先级章节,了解到html5+css3+js不光可以实现动画,其次可以往这个游戏与建模方向发展,更多css3特效访问Gerard Ferrandez on Cod ...