serialize()方法：

作用于一个jQuery对象，它能够将DOM元素内容序列化为字符串，用于Ajax请求。
<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <script type="text/javascript" src="../../js/jquery-2.1.3.js"></script>

    <style>

        * { margin:0; padding:0;}

        body { font-size:12px;}

        .comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}

        .comment h6 { font-weight:700; font-size:14px;}

        .para { margin-top:5px; text-indent:2em;background:#DDD;}

    </style>

    <title></title>

</head>

<body>

<form id="form1" action="#">

    <p>评论:</p>

    <p>姓名: <input type="text" name="username" id="username" /></p>

    <p>内容: <textarea name="content" id="content" rows="2" cols="20"></textarea> </p>

    <p><input type="button" id="send" value="提交"></p>

</form>

<div class="comment">已有评论:</div>

<div id="resText"></div>

</body>

<script type="text/javascript">

    $(function () {

        $("#send").click(function () {

            //这种方式在只有少量的字段的表单中，勉强还可以使用，但如果表单元素越来越复杂，使用这种方式在增大工作量的同时

            //也使表单缺乏弹性。jQuery为这一常用操作提供了一个简化的方法----serialize()

//            $.get("get1.jsp", {

//                username: encodeURI($("#username").val()),

//                content: encodeURI($("#content").val())

//            }, function (data, textStatus) {

//                $("#resText").html(decodeURI(data));

//            });

            //serialize()方法作用于一个jQuery对象，它能够将DOM元素内容序列化为字符串，用于Ajax请求。

            $.get("get1.jsp", $("#form1").serialize(), function (data, textStatus) {

                $("#resText").html(data);

            })

        });

        /**

         * 因为serialize()方法作用于jQuery对象，所以不光只有表单能使用它，其他选择器选取的元素也都能使用它，如以下jQuery代码：

         *      $(":checkbox,:radio").serialize();

         *      把复选框和单选框的值序列化为字符串形式，只会将选中的值序列化

         *

         *

         * serializeArray()方法

         *  该方法不是返回字符串，而是将DOM元素序列化后，返回JSON格式的数据。

         *

         *

         * $.param()方法。它是serialize()方法的核心，用来对一个数组或对象按照key/value进行序列化。

         *

         * 例如：

         *      var obj = {a:1, b:2, c:3};

         *      var k = $.param(obj);

         *      alert(k);//输出a=1&b=2&c=3

         *

         * */

    })

</script>

</html>

Ajax全局事件：

方法名称 说明
ajaxComplete(callback) Ajax请求完成时执行的函数
ajaxError(callback) Ajax请求发生错误时执行的函数，捕捉到的错误可以作为最后一个参数传递
ajaxSend(callback) Ajax请求发送前执行的函数
ajaxSuccess(callback) Ajax请求成功时执行的函数

锋利的jQuery读书笔记---jQuery中Ajax--序列化元素、Ajax全局事件的更多相关文章

  1. 锋利的jQuery读书笔记---jQuery中Ajax--get、post等方法

    load()方法通常用来从Web服务器上获取静态的数据文件,然而这并不能体现ajax的全部价值. 在项目中,如果需要传递一些参数给服务器中的页面,那么可以使用$.get()或者$.post()方法(或 ...

  2. 锋利的jQuery读书笔记---jQuery中Ajax--load方法

    第一个Ajax例子 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  3. 锋利的jQuery读书笔记---jQuery中的事件

    jQuery中的事件: 1.加载DOM:注意window.onload和$(document).ready()的不同 2.事件绑定 3.合成事件 --2和3的详细信息见代码- <!DOCTYPE ...

  4. 锋利的jQuery读书笔记---jQuery中操作DOM

    一般来说,DOM的操作分为3个方面,即DOM Core.HTML-DOM和CSS-DOM jQuery中的DOM操作主要包括以下种类: 查找节点 查找元素节点 查找属性节点 创建节点 创建元素节点 创 ...

  5. 锋利的jQuery读书笔记---jQuery中动画

    jQuery中的动画: 1.show和hide 2.fadeIn和fadeOut 3.slideUp和slideDown <!DOCTYPE html> <html> < ...

  6. chrome中如何查看元素的hover事件

    chrome中如何查看元素的hover事件 一.总结 一句话总结: Elements->Styles里面可以看到":hov":点开选择":hover"就可 ...

  7. 锋利的jQuery读书笔记---选择器

    前段时间入手了锋利的jQuery(第二版),想着加强下自己的js能力,可前段时间一只在熟悉Spring和Hibernate.最近抽时间开始读这本书了,随便也做了些记录. 读书的过程是边看边代码测试,所 ...

  8. Javascript & JQuery读书笔记

    Hi All, 分享一下我学JS & JQuery的读书笔记: JS的3个不足:复杂的文档对象模型(DOM),不一致的浏览器的实现和便捷的开发,调试工具的缺乏. Jquery的选择器 a. 基 ...

  9. JQuery学习笔记——JQuery基础

    #,JQuery避免名称冲突的方法 var jq = jQuery.noConfilct(); jq.ready( function(){     jq("p").hidden() ...

随机推荐

  1. React-组件嵌套-子组件通过委托向父组件传值

    一.简述 父组件嵌套子组件,父组件的处理函数通过属性的方式赋值组子组件( <GenderSelect handleSelect={this.handleSelect}></Gende ...

  2. Hibernate笔记——C3P0配置

    Hibernate作为持久层(ORM)框架,操作数据库,自然也就离不开数据库连接池了.其支持多种连接池,这里就用最熟悉的C3P0连接池. C3P0连接池前面已经介绍了并使用很多次了就不再详细说明了. ...

  3. POSIX、XNU

    POSIX 表示可移植操作系统接口(Portable Operating System Interface ,缩写为 POSIX ),POSIX标准定义了操作系统应该为应用程序提供的接口标准,是IEE ...

  4. Android 自定义View，仿微信视频播放按钮

    闲着,尝试实现了新版微信视频播放按钮,使用的是自定义View,先来个简单的效果图...真的很简单哈. 由于暂时用不到,加上时间原因,加上实在是没意思,加上……,本控件就没有实现自定义属性,有兴趣的朋友 ...

  5. Model的验证

    ModelValidator与ModelValidatorProvider ModelValidator public abstract class ModelValidator { public v ...

  6. dojo 二 AMD模块

    可参考官方教程:http://dojotoolkit.org/documentation/tutorials/1.7/hello_dojo/教程里主要定义了两个方法,setText设置文本内容和res ...

  7. linux硬件驱动层

    1.make menuconfig scripts/kconfig/lxdialog/menubox.o: In function `print_buttons':menubox.c:(.text+0 ...

  8. SQLServer2008 行转列2

    with a as ( select numb,name,row_number() over( partition by numb order by name desc) rowid from fen ...

  9. webhdfs追加写HDFS异常

    问题 {:timestamp=>"2015-03-04T00:02:47.224000+0800", :message=>"Retrying webhdfs ...

  10. maven3实战之仓库(快照版本)

    maven3实战之仓库(快照版本) ---------- 在Maven的世界中,任何一个项目或者构件都必须有自己的版本.版本的值可能是1.0.0,1.3-alpha-4,2.0,2.1-SNAPSHO ...