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. Android笔记——PreferenceActivity结合PreferenceFragment创建设置界面

    1.创建类继承PreferenceActivity 2.该类必须重写OnBuildHeaders和isValidFragment方法.         (1)OnBuildHeaders方法中使用lo ...

  2. 网页爬虫的设计与实现（Java版）

    网页爬虫的设计与实现(Java版)     最近为了练手而且对网页爬虫也挺感兴趣,决定自己写一个网页爬虫程序. 首先看看爬虫都应该有哪些功能. 内容来自(http://www.ibm.com/deve ...

  3. 《mysql悲观锁总结和实践》-悲观锁

    最近学习了一下数据库的悲观锁和乐观锁,根据自己的理解和网上参考资料总结如下: 悲观锁介绍(百科): 悲观锁,正如其名,它指的是对数据被外界(包括本系统当前的其他事务,以及来自外部系统的事务处理)修改持 ...

  4. js中Number

    var numberObject=new Number(1333);numberObject.valueOf(); 1333 var numberObject=new Number(1333);num ...

  5. leetcode：Delete Node in a Linked List

    Write a function to delete a node (except the tail) in a singly linked list, given only access to th ...

  6. 台湾P2P平台

    2014年6月28日下午1:30,“2014两岸三地P2P网贷行业高峰论坛”在上海会展中心友谊会堂如期举行,现场高朋满座,来自全国各地的众多知名P2P网站平台的负责人参与了讨论,并就当前P2P行业的一 ...

  7. JSON 之 SuperObject(8): 关于乱码的几种情况 - 向 Henri Gourvest 大师报告

    这几天学习 JSON - SuperObject, 非常幸运地得到了其作者 Henri Gourvest 大师的同步指点! (Henri 大师也是 DSPack 和 GDI+ 头文件的作者; 大师是法 ...

  8. 64位Ubuntu 13.04 安装Bochs 2.3.5

    bochs 2.3.5源码编译 网上编译bochs的资料非常多,基本的问题都有解决方案,我重点讲不常见的问题. 基本安装步骤 tar vxzf bochs-2.3.5.tar.gz cd bochs- ...

  9. 【笨嘴拙舌WINDOWS】GDI对象之位图

    GDI对象在windows中可以描述成为一次绘画操作时可使用的抽象工具.包括(画笔.画刷.字体.区域.调色板.位图等) GDI对象里的对象概念和在编程领域中面向对象编程的对象概念是不一样的! GDI对 ...

  10. 引用问题rayshop.common总是提醒重复引用问题

    引用问题rayshop.common总是提醒重复引用问题 解决办法:在插件组里的所有项目引用,使用不能复制属性