jQuery ajax serialize() 方法使用示例

.serialize() 方法创建以标准 URL 编码表示的文本字符串。它的操作对象是代表表单元素集合的 jQuery 对象。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/jscript">
// $(function () {
// alert($("form").serialize());
// }) 

function btnClick() {
alert($("form").serialize());
}
</script>
</head>
<body>
<form>
<div><input type="text" name="a" value="1" id="a" /></div>
<div><input type="text" name="b" value="2" id="b" /></div>
<div><input type="hidden" name="c" value="3" id="c" /></div>
<div>
<textarea name="d" rows="8" cols="40">4</textarea>
</div>
<div><select name="e">
<option value="5" selected="selected">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select></div>
<div>
<input type="checkbox" name="f" value="8" id="f" />
</div>
<div>
<input type="button" name="g" value="提交" id="g" onclick="btnClick()" />
</div>
</form> 

</body>
</html><span style="font-size:18px;color:#ff0000;">
</span>

点击提交:

输出标准的查询字符串：a=1&b=2&c=3&d=4&e=5

如果将复选框也选上的话 输出的就是：a=1&b=2&c=3&d=4&e=5&f=8

赞 (0)

相关推荐

  • jQuery ajax serialize()方法的使用以及常见问题解决

    使用ajax时,常常需要拼装input数据为'name=abc&sex=1'这种形式,用JQuery的serialize方法可以轻松的完成这个工作! jQuery ajax - serialize() 方法定义和用法 serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身. 序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中. jQuery ajax - serializ

  • Ajax serialize() 表单进行序列化方式上传文件

    通过传统的 form 表单提交的方式上传文件 <form id="uploadForm" action="" method="post" enctype="multipart/form-data"> <p>上传文件:<input type ="file" name="file"/></p> <input type="subm

  • jQuery ajax中使用serialize()方法提交表单数据示例

    jQuery ajax中使用serialize()方法提交表单数据示例

    jQuery ajax中数据以键值对(Key/Value)的形式发送到服务器,使用ajax提交表单数据时可以使用jQuery ajax的serialize() 方法表单序列化为键值对(key1=value1&key2=value2-)后提交.serialize() 方法使用标准的 URL-encoded 编码表示文本字符串.下面是使用serialize()序列化表单的实例: 复制代码 代码如下: $.ajax({   type: "POST",   url: ajaxCallU

  • jQuery基于ajax()使用serialize()提交form数据的方法

    本文实例讲述了jQuery基于ajax()使用serialize()提交form数据的方法.分享给大家供大家参考,具体如下: jQuery的serialize()方法通过序列化表单值,创建URL编码文本字符串,我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化,如: <form action=""> First name: <input type="text" name="FirstName" value=&qu

  • jQuery ajax serialize() 方法使用示例

    .serialize() 方法创建以标准 URL 编码表示的文本字符串.它的操作对象是代表表单元素集合的 jQuery 对象. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999

  • Jquery Ajax请求方法小结(值得收藏)

    Jquery Ajax请求方法小结(值得收藏)

    jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法,当然,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()的(这个后面会说到). 1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中. url (String) :

  • jquery的each方法使用示例分享

    对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用.而jQuery对象提供的each方法则是对jQuery内部的子元素进行逐个调用. 复制代码 代码如下: jQuery.prototype.each=function( fn, args ) {  return jQuery.each( this, fn, args ); } 让我们

  • jquery ajax 同步异步的执行示例代码

    大家先看一段简单的jquery ajax 返回值的js 代码 复制代码 代码如下: function getReturnAjax{ $.ajax({ type:"POST", http://www.jb51.net/userexist.aspx", data:"username="+vusername.value, success:function(msg){ if(msg=="ok"){ showtipex(vusername.id,

  • JQuery中queue方法用法示例

    本文实例讲述了JQuery中queue方法用法.分享给大家供大家参考,具体如下: jquery的queue方法 显示或操作在匹配元素上执行的函数队列 意思就是对匹配上的元素,显示作用在这个元素上的函数的个数,也就是上述所说的"显示",而操作则是更改这些作用在该元素上的函数队列 举个例子: <style> div { margin:3px; width:40px; height:40px; position:absolute; left:0px; top:30px; back

  • JQuery扩展对象方法操作示例

    本文实例讲述了JQuery扩展对象方法操作.分享给大家供大家参考,具体如下: 应项目需求,对JQuery进行了一个扩展,需求如下: 项目中需要在浏览器右下角提示操作错误和系统提示内容,并有滑动移出和关闭的效果,所以自己写了一个效果还可以的弹出框来.就是给JQuery添加了一个方法ShowMsg. 先上代码: $.fn.extend({ ShowMsg: function (width, height, msgTitle_, msgContent_) { var TopY = 0; //初始化元素

  • Jquery ajax书写方法代码实例解析

    Ajax在前端的应用极其广泛,因此,我们有必要对其进行总结,以方便后期的使用. AJAX优点: 可以异步请求服务器的数据,实现页面数据的实时动态加载, 在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容. jquery在全局对象jquery(也就是$)绑定了ajax()函数,可以处理Ajax请求,ajax常用的配置选项有: async 是否异步执行,默认为True,千万不要指定为False method 发送的Method,缺省为"GET",可指定为'POST','P

  • jquery常用特效方法使用示例

    1. jQuery fadeIn() 用于淡入已隐藏的元素. 语法: 复制代码 代码如下: $(selector).fadeIn(speed,callback); 实例: 复制代码 代码如下: $("button").click(function(){  $("#div1").fadeIn();  $("#div2").fadeIn("slow");  $("#div3").fadeIn(3000);});

  • 浅谈jQuery的offset()方法及示例分享

    offset()方法的定义和用法: 此方法返回或设置所匹配元素相对于document对象的偏移量. 语法结构一: $(selector).offset() 获取匹配元素在当前document的相对偏移. 返回的对象包含两个整型属:top和left. 此方法只对可见元素有效. 实例代码: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <style type="te

随机推荐