使用ajax异步交互

 

实现异步通信:

1、定义

AJAX的核心对象XMLHttpRequest

 

XMLHttpRequest:是XMLHTTP组件的对象,通过该对象AJAX可以应用

  程序一样同服务器进行数据层面的交互,不需要每次都进行整个页面的刷新

 

2、步骤

 1)初始化对象并发送XMLHttpRequest请求

   针对IE7.0、8.0、firefox、mozillar、opera、safari浏览器

     var  xmlht=new  XMLHttpRequest

   针对IE5.0、5.5、6.0

     var  xmlhr=new  ActiveXObject()

 2)指定相应处理函数

     onreadystatechange

3)发出HTTP请求

   Open()

     Send()

    status:由服务器返回的 HTTP 状态代码,如 200 表示成功,而 404 表示 "Not Found"

  

 4)处理服务器返回的数据

     responseXML

     responseText

 

例如:

  index.html

 <html >

<head>

  <meta http-equiv="Content-Type" content="text/html; charset=gbk" />

  <title>使用ajax异步交互</title>

 <script type="text/javascript" src="yanzheng.js">

    </script>

 </head>

<body>

   检验用户名称是否存在<br>

   用户名:<input type="text" id="username" value="1" />

           <input type="button" οnclick="yanzheng()" value="提交" />

    <div id="result">

    </div>

     <p>欢迎光临!</p>

    </body>

</html>

 

 yanzheng.js:

function yanzheng(){

   var xmlhttp;

   var username=document.getElementById("username").value;

    xmlhttp=new XMLHttpRequest();

    xmlhttp.onreadystatechange=callback;

  

   function callback(){

   if(xmlhttp.readyState==4){

    if(xmlhttp.status==200){

      var responseText=xmlhttp.responseText;

      var divnode=document.getElementById("result");

      divnode.innerHTML=responseText;

     }

   }

}

xmlhttp.open('GET','demo.php?name='+username,true);

xmlhttp.send(null);

 

}

 

demo.php

<?php

  $get=$_GET[‘name’];

  if($get==”gaozhisheng”)

echo  ”成功”;

  else

    echo  $get.”不存在”;

?>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值