`

Javascript 表单序列化

阅读更多

序列化 序列化是将对象状态转换为可保持或传输的格式的过程。与序列化相对的是反序列化,它将流转换为对象。这两个过程结合起来,可以轻松地存储和传输数据。

 

 

function serializeForm(whichForm)
{
	var parts = new Array();
	var field = null;
	for (var i = 0, len = whichForm.elements.length; i < len; i++)
	{
        field = whichForm.elements[i];
		switch (field.type)
		{
			case "select-one":
			case "select-multipe":
				for (var j = 0, optLen = field.options.length; j < optLen; j++)
				{
					var option = field.options[j];
					if (option.selected)
					{
						var optValue = "";
						if (option.hasAttribute)
						{
                            optValue = (option.hasAttribute("value") ? option.value : option.text);
                        } else {
                            optValue = (option.attributes["value"].specified ? option.value : option.text);
                        }
                        parts.push(encodeURIComponent(field.name) + "=" + encodeURIComponent(optValue));
                    }
                }
				break;
			case undefined:
			case "file":
			case "submit":
			case "reset":
			case "button":
				break;
			case "radio":
			case "checkbox":
				if (!field.checked)
				{
					break;
                }
			default:
                parts.push(encodeURIComponent(field.name) + "=" + encodeURIComponent(field.value));
        }
    }
	return parts.join("&");
}
 

 

分享到:
评论

相关推荐

    用Javascript将form所有内容序列化和反序列化的例子。

    本文将深入探讨如何使用JavaScript对表单数据进行序列化和反序列化。 序列化是将数据结构或对象转换为字符串的过程,便于存储或传输。在HTML表单中,序列化通常是指将表单元素的值转换为URL编码的字符串,以便通过...

    Javascript表单序列化原理及实现代码详解

    随着 Ajax 的出现,表单序列化已经成为一种常见需求。在 JavaScript 中,可 以利用表单字段的 type 属性,连同 name 和 value 属性一起实现对表单的序列化。在编写代码之前, 有必须先搞清楚在表单提交期间,浏览器...

    web前端培训教程表单序列化共4页.pdf.zip

    本教程聚焦于一个关键的前端技术——表单序列化,这是构建动态和交互式Web应用的重要环节。表单序列化是将HTML表单中的数据转换为服务器可理解的数据格式的过程,通常用于提交表单数据。 一、表单序列化的概念 在...

    json数据序列化和反序列化

    2. 数据序列化:序列化是将对象转换为可传输或存储的格式,对于JSON,这意味着将JavaScript对象转换为JSON字符串。在JavaScript中,我们可以使用`JSON.stringify()`方法实现这一过程。例如: ```javascript let obj ...

    将表单序列化为json对象

    ### 将表单序列化为JSON对象:深入解析与应用 #### 一、知识点概述 在Web开发中,经常需要处理HTML表单数据,并将其发送到服务器进行进一步处理。传统的做法是通过`form`标签的`submit`事件来提交表单数据,但这种...

    原生js实现form表单序列化的方法

    使用原生JavaScript实现表单序列化可以让开发者更好地掌握数据处理的细节,并且在不引入外部库(如jQuery)的情况下也能实现强大的功能。这在一些轻量级的应用或者需要优化加载速度的场景下是非常有用的。当然,实际...

    基于JavaScript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象)

    JavaScript中的表单序列化是将HTML表单中的数据转换为URL查询字符串的过程,这在进行AJAX请求或者处理用户输入时非常常见。然而,原始的序列化结果通常是以`key=value`的形式,对于复杂的结构,如包含嵌套对象的数据...

    第34章 项目1-博客前端:封装库--表单序列化1

    在JavaScript中,我们可以扩展jQuery或其他库,实现自定义的表单序列化方法。以下是一个简单的示例: ```javascript $.fn.extend('serialize', function() { var parts = {}; for (var i = 0; i ; i++) { var ...

    js表单序列化判断空值的实例

    在本实例中,使用了JavaScript对表单序列化进行了操作,并引入了判断空值的逻辑。具体操作是通过jQuery库中提供的方法对表单进行序列化,并且在提交表单之前对序列化得到的数据进行了遍历和判断,以确保所有需要的...

    简单了解Ajax表单序列化的实现方法

    本文将深入探讨Ajax表单序列化的实现方法及其相关知识点。 首先,了解表单序列化的基本原理。当用户填写表单并点击提交按钮时,浏览器会自动将表单数据按照特定规则进行编码,并以键值对的形式发送给服务器。这些...

    前台提交到controller序列化复杂对象

    在这个场景中,"前台提交到controller序列化复杂对象"是一个关键的技术环节。本文将深入探讨如何使用System.Web.Extensions命名空间中的JavaScriptSerializer类来实现这个目标。 首先,让我们理解什么是序列化。...

    jQuery实现form表单序列化转换为json对象功能示例

    // 表单序列化 $("#result").html(JSON.stringify(post_data)); // 将结果转换为字符串并显示 }); }); ``` 在这个示例中,当用户点击“发送”按钮后,`$("#post_form").serializeJson()`会返回一个JSON对象,该...

    原生Javascript开发让你的表单亮起来

    五、表单序列化与提交 在JavaScript中,我们可以使用`FormData`对象来序列化表单数据,方便发送到服务器。同时,利用`XMLHttpRequest`或`fetch` API,可以实现异步提交,提高用户体验。 六、表单动画与过渡效果 ...

    jquery序列化表单去除指定元素示例代码

    最后,需要注意的是,当我们在使用`.serialize()`方法序列化表单数据时,那些没有指定`name`属性的表单元素将不会被序列化,即使它们没有被`.not()`方法排除。因此,在设计表单结构时,应当谨慎使用`name`属性,确保...

    jQuery 表单序列化实例代码

    标题中提到的知识点是“jQuery 表单序列化实例代码”,这指的是利用jQuery这个流行的JavaScript库简化在客户端对HTML表单数据进行序列化的过程。表单序列化主要是将表单中的输入元素编码为字符串,以便能够将其作为...

    JS中from 表单序列化提交的代码

    在本文中,我们将深入探讨如何在JavaScript中实现表单序列化提交,并提供一个简单的示例代码。 表单序列化的核心是将表单中的输入元素,如文本框、复选框、单选按钮等,转换成键值对的形式,这些键值对可以用在URL...

    jQuery将表单序列化成一个Object对象的实例

    标题提到的"jQuery将表单序列化成一个Object对象的实例",主要涉及到jQuery的`serializeArray()`方法和自定义扩展功能,以适应开发者对于更方便的数据结构的需求。 `serializeArray()`是jQuery提供的一个方法,用于...

    关于jquery form表单序列化的注意事项详解

    本文将深入探讨jQuery中`form`表单序列化时需要注意的事项,以及如何正确使用这一功能。 首先,我们要明白表单序列化的主要方法是`$.serialize()`和`$.serializeArray()`。`$.serialize()`将表单数据转换为字符串,...

    javascript (2)_表单美化_javascript_

    4. **表单序列化**:在表单提交之前,JavaScript可以将表单数据序列化为JSON对象,方便服务器端处理。 5. **异步提交**:利用AJAX技术,可以实现无刷新的表单提交,提高用户体验。同时,可以显示加载指示器,告知...

Global site tag (gtag.js) - Google Analytics