Ajax(二)

前端之家收集整理的这篇文章主要介绍了Ajax(二)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

把Ajax(一)中的例子改为,使用http请求为post方式

一、返回数据格式为xml格式

registerProcess.PHP页面

      1. @H_502_11@@H_502_11@<?PHP
      1. @H_502_11@header("Content-type:text/xml;charset=GBK"@H_502_11@);
      1. @H_502_11@header('Cache-Control:no-cache'@H_502_11@);
      1. @H_502_11@//接收数据@H_502_11@
      1. @H_502_11@$username@H_502_11@=$_POST@H_502_11@['username'@H_502_11@];
      1. @H_502_11@//http响应。过程3@H_502_11@
      1. @H_502_11@$info@H_502_11@=""@H_502_11@;
      1. @H_502_11@if@H_502_11@($username@H_502_11@=="xiyou"@H_502_11@){
      1. @H_502_11@$info@H_502_11@="<res><mes>用户名不可用,对不起</mes></res>"@H_502_11@;
      1. @H_502_11@}else@H_502_11@{
      1. @H_502_11@$info@H_502_11@="<res><mes>用户名可用</mes></res>"@H_502_11@;
      1. @H_502_11@}
      1. @H_502_11@echo@H_502_11@$info@H_502_11@;
      1. @H_502_11@?>

    header("Content-Type:text/xml;charset:utf-8");//告诉浏览器返回的是xml格式
    header('Cache-Control:no-cache');//浏览器不缓存数据

    html页面register.html

        1. @H_502_11@var@H_502_11@url="registerProcess.PHP"@H_502_11@;
        1. @H_502_11@//要发送的数据@H_502_11@
        1. @H_502_11@var@H_502_11@data="username="@H_502_11@+document.getElementById("username"@H_502_11@).value;
        1. @H_502_11@//打开请求@H_502_11@
        1. @H_502_11@myXmlHttpRequest.open("post"@H_502_11@,url,true@H_502_11@);
        1. @H_502_11@//指定回调函数@H_502_11@
        1. @H_502_11@myXmlHttpRequest.onreadystatechange=chuli;
        1. @H_502_11@//必须要加下面这句@H_502_11@
        1. @H_502_11@myXmlHttpRequest.setRequestHeader("Content-type"@H_502_11@,"application/x-www-form-urlencoded"@H_502_11@);
        1. @H_502_11@//如果是get请求则填入null即可;如果是post请求则填入实际的数据@H_502_11@
        1. @H_502_11@myXmlHttpRequest.send(data);
        1. @H_502_11@
        1. @H_502_11@数据就无需写到url了,可以通过send发送。

      建议使用post方式,携带信息多

          1. @H_502_11@function@H_502_11@chuli(){
          1. @H_502_11@if@H_502_11@(myXmlHttpRequest.readyState==4){
          1. @H_502_11@var@H_502_11@mes=myXmlHttpRequest.responseText;
          1. @H_502_11@var@H_502_11@mes_obj=eval("("@H_502_11@+mes+")"@H_502_11@);
          1. @H_502_11@document.getElementById("myres"@H_502_11@).value=mes_obj.res;
          1. @H_502_11@}

        二、返回数据格式为JSON

        PHP代码

            1. @H_502_11@@H_502_11@<?PHP
            1. @H_502_11@header("Content-type:text/html;charset=GBK"@H_502_11@);
            1. @H_502_11@header('Cache-Control:no-cache'@H_502_11@);
            1. @H_502_11@//接收数据@H_502_11@
            1. @H_502_11@$username@H_502_11@=$_POST@H_502_11@['username'@H_502_11@];
            1. @H_502_11@//http响应。过程3@H_502_11@
            1. @H_502_11@$info@H_502_11@=""@H_502_11@;
            1. @H_502_11@//$info是JSON数据格式的字符串@H_502_11@
            1. @H_502_11@if@H_502_11@($username@H_502_11@=="xiyou"@H_502_11@){
            1. @H_502_11@$info@H_502_11@="{'res':'用户名不可用,对不起'}"@H_502_11@;
            1. @H_502_11@}else@H_502_11@{
            1. @H_502_11@$info@H_502_11@="{'res':'用户名可用'}"@H_502_11@;
            1. @H_502_11@}
            1. @H_502_11@echo@H_502_11@$info@H_502_11@;
            1. @H_502_11@?>

          Javascript代码(更改部分)

              1. @H_502_11@function@H_502_11@chuli(){
              1. @H_502_11@if@H_502_11@(myXmlHttpRequest.readyState==4){
              1. @H_502_11@var@H_502_11@mes=myXmlHttpRequest.responseText;
              1. @H_502_11@var@H_502_11@mes_obj=eval("("@H_502_11@+mes+")"@H_502_11@);
              1. @H_502_11@document.getElementById("myres"@H_502_11@).value=mes_obj.res;
              1. @H_502_11@}

            JSON只是一种文本字符串。它被存储在responseText属性
            为了读取存储在responseText属性中的JSON数据,需要根据Javascript的eval语句。
            函数eval会把一个字符串当作它的参数。然后这个字符串会被当作Javascript代码来执行。
            因为JSON的字符串是由Javascript代码构成的,所以它本身是可执行的。


            JSON(Javascript Object Notation)一种简单的数据格式,比xml更轻巧,JSON是Javascript原生格式; 这意味着在Javascript中处理JSON数据不需要任何特殊的API或工具包。 JSON的规则很简单:对象是一个无序的“名称/值”集合。一个对象以“{”开始,“}”结束。 每个“名称”后跟一个“:”(冒号); ‘名称/值’对之间使用“,”(逗号)分隔。 规则如下: 1. 映射用冒号表示。名称:值。 2. 并列的数据之间用逗号分隔。名称1:值1, 名称2:值2; 3. 映射的集合(对象)用大括号表示。{名称1:值1,名称2:值2} 4. 并列数据的集合(数组)用方括号(“[]”)表示。 [ {名称1:值1,名称2:值2}, {名称1:值1,名称2:值2}, ] 5. 元素值可具有的类型:string,number,object,array,true,false,null

            猜你在找的Ajax相关文章