jquery form表单赋值封装
;!(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表单赋值封装的更多相关文章
- 针对form表单赋值封装
1 (function ($){ 2 $.fn.extend({ 3 exajax:function(url,opts,convert){ 4 var ajaxParam = { 5 url:url, ...
- jQuery Form 表单提交插件-----formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的 应用
一.jQuery Form的其他api 1. formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...
- jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址
一.jQuery Form简介 jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxF ...
- Jquery form表单提交
起因 由于项目中原先提交from是通过JavaScript指定action,在submit提交的,使用的方式,也不是很标准,造成除了ie之外的浏览器都不能正常的提交数据,做web项目还是要考虑到浏览器 ...
- ajax上传文件 基于jquery form表单上传文件
<script src="/static/js/jquery.js"></script><script> $("#reg-btn&qu ...
- 文档驱动 —— 表单组件(六):基于AntDV的Form表单的封装,目标还是不写代码
开源代码 https://github.com/naturefwvue/nf-vue3-ant 也不知道大家是怎么写代码的,这里全当抛砖引玉 为何封装? AntDV非常强大,效果也非常漂亮,功能强大, ...
- Jquery Form表单取值
之前js取form表单的值都是一个一个的取,数量一多之后容易出错而且烦透了.感谢那些愿意分享的人. 页面定义form,并给form指定id值,里面的元素只要是需要键值对应的都赋予name属性,并且na ...
- jQuery Form 表单提交插件-----ajaxSubmit() 的应用
Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.ajaxSubmit() 介绍 立即通过AJ ...
- jQuery Form 表单提交插件-----ajaxForm() 的应用
Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.ajaxForm() 介绍 ajaxForm ...
随机推荐
- Python 元类 - Metaclasses
Python 元类 - Metaclasses 默认情况下儿, classes 是有 type() 构造的. 类的结构体在一个新的 namespace 被执行, 类的名字 class name 绑定( ...
- 14-SSM整合
今日知识 1. Spring整合MyBatis 2. SSM普通整合 3. SSM整合(Spring和SpringMVC分离) 4. 纯JavaConfig的SSM Spring整合MyBatis 1 ...
- ORB-SLAM2 论文&代码学习 ——Tracking 线程
本文要点: ORB-SLAM2 Tracking 线程 论文内容介绍 ORB-SLAM2 Tracking 线程 代码结构介绍 写在前面 上一篇文章中我们已经对 ORB-SLAM2 系统有了一个概览性 ...
- Nginx安装(yum源)
CentOS7 $ vi /etc/yum.repos.d/nginx.repo [nginx] name=nginx repo baseurl=http://nginx.org/packages/c ...
- 接入谷歌广告错误(主要Adsense)
接入谷歌广告 1. 谷歌初始化完会有透明占位,记得隐藏防止下方游戏无法点击 2. 测试的广告域名似乎需要https和www才能播放adsense视频广告 3. 谷歌广告1009错误,广告id或者账号i ...
- 一台机器上同时运行两个tomcat
修改conf/server.xml文件,修改地方有三处 如图
- Windows Server 2012 R2的安装(GUI桌面版本)
镜像:cn_windows_server_2012_r2_x64_dvd_2707961.iso 1.将安装光盘插入服务器,开机会读取到Windows安装程序,点击下一步 2.点击现在安装 3 ...
- XOR and Favorite Number CodeForces - 617E
a[i]^a[i+1]--a[j]=k; 处理前缀和pre[i] 那么上式可以表示为pre[i-1]^pre[j]=k; #include<bits/stdc++.h> using nam ...
- 在window上安装mysql - MySQL5.7.24 版本
1.下载安装包 下载地址:https://dev.mysql.com/downloads/mysql/5.7.html#downloads 点击Download,选择 No thanks, just ...
- Python 爬取必应壁纸
import re import os import requests from time import sleep headers = { "User-Agent": (&quo ...