jquery+json

目标
    掌握 jQuery 高级方法--遍历
    掌握 jQuery 开发 Ajax 的方法
    掌握 Ajax 开发中后台的数据传输格式--XML、JSON
    掌握如何在项目中使用 JSON
   
1、掌握 jQuery 高级方法--遍历
    由于 jQuery 的元素、类别选择器一次可能选中多个标签。
我们可以使用遍历方法循环这些标签。

   表格隔行换色；
    each(function(i){});

     如果想得到其中指定索引位置的元素 $(xx).get(index)
索引从0 开始。
     取得其中一个匹配的元素
     这能够让你选择一个实际的 DOM 元素并且对他直接操作，
而不是通过 jQuery 函数。$(this).get(0)与$(this)[0]等价。
    get() 方法返回的是一个 DOM 对象，而不是 jQuery 对象
  
   复选框全选功能；

2、掌握 jQuery 开发 Ajax 的方法
    在 jQuery 框架中，提供了简化 Ajax 开发的一系列方法
最根本的方法
    返回值:XMLHttpRequest   jQuery.ajax([options])

    //创建 XMLHttpRequest 对象，跨浏览器的对象
    $.ajax();
    //调用 open() onreadystatechange send();
    $.ajax({
      type: "GET",
      url: "test.js",
      dataType: "script"
    });
   
    $.ajax({
       type: "POST",
       url: "some.php",
       data: "name=John&location=Boston",
       success: function(msg){
         alert( "Data Saved: " + msg );
       }
    });
   
   
    //原始代码  ,处理乱码
    var name = document.getElementById("userName").value;
    var url = "ajaxservlet?name="+escape(name); //处理乱码
    (1)xmlreq.open("POST","ajaxservlet",true);
    //如果用 post 方式提交，定义表单提交
    (2)xmlreq.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    //提前处理响应内容
    (3)xmlreq.onreadystatechange=function update(){
        (4)if(xmlreq.readyState==4){
            if(xmlreq.status==200){
              var msg = xmlreq.responseText;
                document.getElementById("message").innerHTML=msg;
            }
        }        
    }
    //发送请求
    (5)xmlreq.send("name="+escape(name));
   
    //后台 Servlet 处理
    //后台接受参数
    String name = request.getParameter("name");
    String changename = new String(name.getByte("ISO-8859-1"),"UTF-8");
   
    //后台返回数据
    (6)response.setContextType("text/html; charset=UTF-8");
    response.setContextType("text/xml; charset=UTF-8");
    response.setContextType("text/script; charset=UTF-8");
    response.setContextType("application/json; charset=UTF-8");
   
contentType
   对应代码(2)，指请求时设置请求头信息 POST 请求时使用
   String(默认: "application/x-www-form-urlencoded") 发送信息至服务器时内容编码类型。默认值适合大多数应用场合。

data
  对应代码 (5)，指用 POST 发送请求时，传递的参数
  Object,String发送到服务器的数据。将自动转换为请求
字符串格式。
   GET 请求中将附加在 URL 后。查看 processData 选项说明
以禁止此自动转换。
   必须为 Key/Value 格式。
   如果为数组，jQuery 将自动为不同值对应同一个名称。
   如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。
    String[] foo = request.getParameters("foo");
  
dataType   String
   服务响应内容的类型
  预期服务器返回的数据类型。如果不指定，jQuery 将自动
根据 HTTP 包 MIME 信息返回 responseXML 或 responseText，
并作为回调函数参数传递，可用值:
    "xml": 返回 XML 文档，可用 jQuery 处理。
    "html": 返回纯文本 HTML 信息；包含的script标签会在插入dom时执行。
    "script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意：'''在远程请求时(不在同一个域下)，所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
    "json": 返回 JSON 数据 。
    "jsonp": JSONP 格式。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
    "text": 返回纯文本字符串


   
   
   

3、掌握 Ajax 开发中后台的数据传输格式--XML、JSON
    XML 与 JSON 数据格式，一般用于从服务器返回大量数据的情况下。
返回的数据封装在 XML 或 JSON 中，可以在页面中通过对应
的 API 对数据进行解析，从而在页面上显示出这些数据
   
   

4、掌握如何在项目中使用 JSON
JSON 是一个字符串，该字符串按照规定 的格式，保存用户
需要的数据
id=1   name=中国    {"id":"1","name":"中国","":""}


"[{"id":"1","name":"中国"},{"id":"2","name":"美国"}]"

[{"id":"1","name":"北京"},{"id":"2","name":"重庆"},{"id":"3","name":"天津"},{"id":"4","name":"上海"},{"id":"5","name":"香港"},{"id":"6","name":"澳门"},{"id":"7","name":"河北"},{"id":"8","name":"山西"},{"id":"9","name":"辽宁"},{"id":"10","name":"吉林"},{"id":"11","name":"黑龙江"},{"id":"12","name":"江苏"},{"id":"13","name":"浙江"},{"id":"14","name":"安徽"},{"id":"15","name":"福建"},{"id":"16","name":"江西"},{"id":"17","name":"山东"},{"id":"18","name":"河南"},{"id":"19","name":"湖北"},{"id":"20","name":"湖南"},{"id":"21","name":"广东"},{"id":"22","name":"广西"},{"id":"23","name":"海南"},{"id":"24","name":"四川"},{"id":"25","name":"贵州"},{"id":"26","name":"云南"},{"id":"27","name":"西藏"},{"id":"28","name":"陕西"},{"id":"29","name":"甘肃"},{"id":"30","name":"青海"},{"id":"31","name":"内蒙古"},{"id":"32","name":"宁夏"},{"id":"33","name":"新疆"},{"id":"34","name":"台湾"},{"id":"35","name":"其它"}]


www.json.org

步骤：
(1)从数据库得到 List 数据
(2)新建 JSONArray 对象，
(3)循环 List ，封装属性到 JSONObject 对象中。
(4)把每个 JSONObject 对象封装在 JSOnArray 中
(5)把 JSONArray  对象转化为字符串对象返回到前台





5、任务
1、用 jQuery 完成用户输入验证：用户名、密码、确认密码、邮箱
2、熟悉 Ajax  JSON 的例子、模仿完成对应的例子