//js将表单序列化成对象
$.fn.serializeObject = function () {
var $els = $(this).find("[name]");
var formData = {};
var len = $els.length;
for (var i = 0; i < len; i++) {
var $item = $($els[i]);
var name = $item.attr("name");
var type = $item.attr("type");
if (type == "checkbox") {
formData[name] = $item.is(':checked');
}
else
{
formData[name] = $item.val();
}
}
return formData;
}; /*根据name给子元素的Text赋值*/
$.fn.SetChildsText = function (model) {
var el = this.find("[name]");
var elCount = el.length;
if (elCount > 0) {
for (var i = 0; i < elCount; i++) {
$itemEl = $(el[i]);
var name = $itemEl.attr("name");
var formatterFun = $itemEl.attr("data-formatter");
var value = model[name];
if (value != null) {
if (typeof (window[formatterFun]) == "function") {
value = window[formatterFun](value);
}
$itemEl.text(value);
}
else {
$itemEl.text("");
}
}
}
}; /*获取查询参数*/
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
} /**
* 绑定下拉框
* @param {any} selId:下拉框Id
* @param {any} url
* @param {any} idField
* @param {any} valueField
* @param {any} initValue:初始值
*/
function BindSelect(selId, url, idField, valueField, initValue) {
$.get(url, function (data) {
var len = data.length;
var selItems = [];
for (var i = 0; i < len; i++) {
selItems.push('<option value="' + data[i][idField] + '">' + data[i][valueField] + '</option>');
}
$("#" + selId).append(selItems);
if (initValue) {
$("#" + selId).val(initValue);
}
});
} /*表单赋值*/
function FormLoad(formId, data) {
var $form = $("#" + formId);
$.each(data, function (name, ival) {
var $oinput = $form.find("input[name=" + name + "]");
if ($oinput.attr("type") == "radio" || $oinput.attr("type") == "checkbox") {
$oinput.each(function () {
if (Object.prototype.toString.apply(ival) == '[object Array]') {// 是复选框,并且是数组
for (var i = 0; i < ival.length; i++) {
if ($(this).val() == ival[i])
$(this).attr("checked", "checked");
}
} else {
if ($(this).val() == ival)
$(this).attr("checked", "checked");
}
});
} else if ($oinput.attr("type") == "textarea") {// 多行文本框
$form.find("[name=" + name + "]").html(ival);
} else {
$form.find("[name=" + name + "]").val(ival);
}
});
}

jquery常用表单操作的更多相关文章

  1. 基于jQuery的表单操作

    1,文本框的聚焦和失焦 在对文本框进行操作时,通常为了提升用户体验,是用户的操作得到及时的反馈,会在文本框获得焦点时,让其颜色改变,然后在失去焦点时恢复为原来的样式,一般情况下,我们可以通过css的伪 ...

  2. 基于JQuery的前端form表单操作

    Jquery的前端表单操作:     jquery提供了良好的方法封装,在一些基本的操作的时候,能节省很多的麻烦,其中,在具体使用时,form表单的数据提交是最频繁也最常见的前后数据交换方式,所以在前 ...

  3. jQuery Mobile 表单基础

    jQuery Mobile 会自动为 HTML 表单添加优异的便于触控的外观. jQuery Mobile 表单结构 jQuery Mobile 使用 CSS 来设置 HTML 表单元素的样式,以使其 ...

  4. 通过AJAX和PHP,提交JQuery Mobile表单

    File name: callajax.php <?php $firstName = $_POST[firstName]; $lastName = $_POST[lastName]; echo( ...

  5. 【锋利的jQuery】表单验证插件踩坑

    和前几篇博文提到的一样,由于版本原因,[锋利的jQuery]表单验证插件部分又出现照着敲不出效果的情况. 书中的使用方法: 1. 引入jquery源文件, 2. 引入表单验证插件js文件, 3. 在f ...

  6. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

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

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

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

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

  9. jQuery实现表单验证

    表单是网页的一个重要组成部分.本节做一个简单的表单提交网页然后利用jQuery实现表单的验证.后续的表单完善以及功能的完善会在以后的博客中给出. 效果图: 代码: <!DOCTYPE html ...

随机推荐

  1. eclipse在linux安装报错

    JVM terminated. Exit code=127/usr/bin/java-Dosgi.requiredJavaVersion=1.8-Dosgi.instance.area.default ...

  2. spring cloud+.net core搭建微服务架构:服务发现(二)

    前言 上篇文章实际上只讲了服务治理中的服务注册,服务与服务之间如何调用呢?传统的方式,服务A调用服务B,那么服务A访问的是服务B的负载均衡地址,通过负载均衡来指向到服务B的真实地址,上篇文章已经说了这 ...

  3. Volley Get网络请求

    public class VolleyActivity extends AppCompatActivity { WebView webView; Button button; RequestQueue ...

  4. Android 系统内核层与 Linux Kernel 的比较

    Android 内核具有和标准 Linux 内核一样的功能,主要实现了内存管理.进程调度.进程间通信等功能.但在文件系统.进程间通信.内存管理等方面存在差异. 1.文件系统.移动设备采用的大多不是硬盘 ...

  5. Spring Session - 使用Redis存储HttpSession例子

    目的 使用Redis存储管理HttpSession: 添加pom.xml 该工程基于Spring Boot,同时我们将使用Spring IO Platform来维护依赖版本号: 引入的依赖有sprin ...

  6. netty源码解解析(4.0)-10 ChannelPipleline的默认实现--事件传递及处理

    事件触发.传递.处理是DefaultChannelPipleline实现的另一个核心能力.在前面在章节中粗略地讲过了事件的处理流程,本章将会详细地分析其中的所有关键细节.这些关键点包括: 事件触发接口 ...

  7. [NOI 2017]整数

    Description 题库链接 P 博士将他的计算任务抽象为对一个整数的操作. 具体来说,有一个整数 \(x\) ,一开始为 \(0\) . 接下来有 \(n\) 个操作,每个操作都是以下两种类型中 ...

  8. c++中虚析构函数

    当指向基类的指针指向新建立的派生类对象而且基类和派生类都调用new向堆申请空间时,必须将基类的析构函数声明为虚函数,从而派生类的析构函数也为虚函数,这样才能在程序结束时自动调用它,从而将派生类对象申请 ...

  9. MyBatis——MyEclipse中使用mybatis-generator

    mybatis-generator可以根据数据库的表来生成POJO类.mapper.xml和DAO接口,用这个插件会大大地提高开发的效率.网上虽然有一些使用这个插件的教程,但我单个试了并不能成功,会出 ...

  10. vuex学习及使用

    什么是vuex? 在SPA单页面组件的开发中vuex称为状态管理:简单的理解就是你在state中定义了一个数据之后,你可以在所在项目中的任何一个组件里进行获取.进行修改,并且你的修改可以得到全局的响应 ...