ajax+php 无刷新数据调用经典实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>ajax+php 无刷新数据调用经典实例</title>
<script>
function G(id){
  return document.getElementById(id);
 }
 
 function createXMLHttpRequest(){//创建XMLHttpRequest对象
  if(window.ActiveXObject){//IE
    try {
     return new ActiveXObject("Microsoft.XMLHTTP");
    } catch(e){
     return;
    }
   }else if(window.XMLHttpRequest){//Mozilla,firefox
    try {
     return new XMLHttpRequest();
    } catch(e){
     return;
    }
   }
  }

 function returnCity(Value,divId,at,pid){//主调函数
  var xmlHttp=createXMLHttpRequest();
  var url = "s.php?cid="+Value+"&at="+at+"&pid="+pid+"&mt="+Math.random(100);
  //alert(url);
  if (Value==""){  
   return false ;
  }
  if (xmlHttp){
   callback = getReadyStateHandler(xmlHttp,divId);
   xmlHttp.onreadystatechange = callback;
   xmlHttp.open("GET", url,true);
   xmlHttp.send(null);
  }
 }

 function getReadyStateHandler(xmlHttp,divId){//服务器返回后处理函数
  return function (){
   if(xmlHttp.readyState == 4){
    if(xmlHttp.status == 200){        
      if (xmlHttp.responseText){
       G(divId).innerHTML=xmlHttp.responseText;     
      }else{
       G(divId).innerHTML="";     
      }      
    }
   }
  }
 }
 
 function ajaxData(inputName,divId,action,cpid)
 {
  //alert(inputName);
  var cityid = G(inputName).value;
  var pid = G(cpid).value;  
  returnCity(cityid,divId,action,pid);

 }
</script>
</head>

<body>
<input name="" type="text" onMouseOver="ajaxData('city_type','cityareaid','c','borough_type');" />
<div id="ajaxHtml">
</div>
</body>
</html>
//s.php文件
$Db = new Db();
  $type = ( $action=='esfPice')?1:2;  
  $sql = "Select * from cn_loupan_city_price where city_id ='$cid' and price_type='$type'";
  $query = $Db->query( $sql );
  $str ='';
  if( $Db->rows( $query ) )
  {
   $result = $Db->fetch( $query ,0);
   foreach( $result as $_v => $v )
   {
    
    $str .= "<LI><A onClick="switchprop('price2_Value','".$v['city_price_show']."','price2_List','price','".$v['city_price']."')" href="javascript教程:void(0);" target=_self>".$v['city_price_show']."</A></LI>";    
   }
   echo $str;
  }
  else
  {
   exit('可不选!');
  }  
  //这里只讲ajax不讲数据库教程连接
www.111cn.net原他

时间: 2024-10-26 06:45:10

ajax+php 无刷新数据调用经典实例的相关文章

php+ajax实现无刷新数据分页的办法_php技巧

本文实例讲述了php+ajax实现无刷新分页的方法.分享给大家供大家参考.具体实现方法如下: index.php 文件,代码如下: <?php header("Content-type: text/html;charset=GBK");//输出编码,避免中文乱码 ?> <html> <head> <title>ajax分页演示</title> <script language="javascript"

利用AJAX实现无刷新数据分页_AJAX相关

以前在使用Asp.Net的时候用过GridView这个控件,这个控件自带分页的功能,虽然很丑,但是功能还是很强大的.这里呢,给大家展示一下更加给力的方式--利用AJAX无刷新直接从服务器获取数据分页. 一.实现过程 注意:一下的内容都是在服务器内使用的. 首先要在服务器的路径下建立几个文件,比如,page1.txt,page2.txt,page3.txt. 每个文件中放入数组,如下: 复制代码 代码如下: [{user:'blue',pass:'123'},{user:'aaa',pass:'d

使用ajax技术无刷新动态调用新浪股票实时数据_AJAX相关

新浪的财金频道一直感觉做得很好.但由于最近网速慢的缘故,查看股票信息时网页老是打不开.这几天一直在研究ajax,于是用jquery自己做了一个自动读取新浪股票实时数据的页面. <html> <head> <title>ajax test</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <scri

php+ajax实现无刷新数据分页例子

index.php 文件如下图所示  代码如下 复制代码 <?php header("Content-type: text/html;charset=GBK");//输出编码,避免中文乱码 ?> <html> <head> <title>ajax分页演示</title> <script language="javascript" src="ajaxpg.js"></sc

利用AJAX实现无刷新数据分页

以前在使用Asp.Net的时候用过GridView这个控件,这个控件自带分页的功能,虽然很丑,但是功能还是很强大的.这里呢,给大家展示一下更加给力的方式--利用AJAX无刷新直接从服务器获取数据分页. 一.实现过程 注意:一下的内容都是在服务器内使用的. 首先要在服务器的路径下建立几个文件,比如,page1.txt,page2.txt,page3.txt. 每个文件中放入数组,如下: 复制代码 代码如下:[{user:'blue',pass:'123'},{user:'aaa',pass:'ds

使用ajax技术无刷新动态调用新浪股票实时数据

新浪的财金频道一直感觉做得很好.但由于最近网速慢的缘故,查看股票信息时网页老是打不开.这几天一直在研究ajax,于是用jquery自己做了一个自动读取新浪股票实时数据的页面. <html> <head> <title>ajax test</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <scri

jquery ajax实现无刷新数据加载代码

<html xmlns="http://www.111cn.net/ 1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title></title> <script> var xml_http_building_link = '请等待,正在建立

ajax实现无刷新分页(php)_php实例

复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>投票结果</title> <meta http-equiv="content-type" content=&quo

使用ajax技术无刷新动态调用股票信息

复制代码 代码如下: <html> <head> <title>ajax test</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="jquery.js"></script&