ajax 在php中一个运用

    AJAX即“Asynchronous JavaScript and XML”(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术。

  最初听Ajax,是在学习asp.net时,做网站,局部刷新时,为了提高用户体验,在页面局部有刷新时,只刷新要修改的部分,其他不修改----这就是ajax啦,笨笨的

  上一篇,跟着人家的Ajax,也没试验成功--大致过程就是加入dll,web.config中配置,编写ajax方法([AjaxPro.AjaxMethod]) ,编写js(可调用ajax方法),页面调用js即可...

  想起之前学习php用过一段,也很简单:1.主要就在主页面适当位置调用js方法,并在页面标注要更新的块(可用div,或其他如td等,可根据id找到该块),2.编写js.在js中首先建立一个XMLHttpRequest()对象(IE的ActiveXObject('Microsoft.XMLHTTP');) 然后使用类似open("GET",url,true)方法打开url(则会跳转到url页面进行预定的处理)--再指定onreadystatechange = getcityOk;再getcityOk方法中根据id获得主页面的预更新块,让其innerHTML=xmlHttp.responseText 3.建立js中指向的url页面,url页面的内容将通过xmlHttp.responseText显示到主页面内...糊涂了,看代码:

城市联动为例:

1.主页面

<?php
/*
 * Created on 2009-11-19
 * 测试城市 级联,联动 使用ajax
 
*/
 
include('../include.php');
?>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
测试城市 级联
,联动 使用ajax:
<hr>
<?php

$citys2 =$db->query("select * from tcity where fid=0");
?>
<select id="province" name="province" onChange="getcity();">
<?php
while($row2 = $db->getRows($citys2))
{
    
echo "<option value=".$row2[cityId];
    
echo ">".$row2[cityName]."</option>";
}
?>
</select>

<div id = "city_select">
</div>

<div id = "city_select2">
</div>

2js代码:

代码
var xmlHttp;
function s_xmlhttprequest()
{
    
if(window.ActiveXObject)
    {
        xmlHttp 
= new ActiveXObject('Microsoft.XMLHTTP');
    }
else if(window.XMLHttpRequest)
    {
        xmlHttp 
= new XMLHttpRequest();
    }
}




function getcity(){
    s_xmlhttprequest();
    document.getElementById(
'city_select2').innerHTML="";
    
var randNum =  (new Date()).getSeconds();

    
var selectObj = document.getElementById("province");
    
var url = "ajax_city2.php?cityid=" +escape(selectObj.options[selectObj.selectedIndex].value)+"&rand="+randNum;

    xmlHttp.open(
"GET", url, true);
    xmlHttp.onreadystatechange 
= getcityOk;
    xmlHttp.send(
null);
}

function getcityOk(){
    
if (xmlHttp.readyState == 4) {
        
var response = xmlHttp.responseText;
        
try{
            document.getElementById(
'city_select').innerHTML=response;
        }
catch(exception){}
    }

}



function getconty(){
    s_xmlhttprequest();
    
var randNum =  (new Date()).getSeconds();

    
var selectObj = document.getElementById("city2");
    
var url = "ajax_city3.php?cityid=" +escape(selectObj.options[selectObj.selectedIndex].value)+"&rand="+randNum;

    xmlHttp.open(
"GET", url, true);
    xmlHttp.onreadystatechange 
= getcityOk2;
    xmlHttp.send(
null);
}

function getcityOk2(){
    
if (xmlHttp.readyState == 4) {
        
var response = xmlHttp.responseText;
        
try{
            document.getElementById(
'city_select2').innerHTML=response;
            
// classObj.outerHTML=response;
        }catch(exception){}
    }

}

3.js中转向的页面

<?php
 
include('../include.php');
?>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
<?php


$provinceid=$_GET['cityid'];

$sql_str = "select * from tcity where fid=$provinceid";

if($provinceid)
{
    
$city2 = $db->query($sql_str);
}
if($city2)
{
    
$nums = 0;
    
$nums = $db->getRowsNum($city2);

    
if($nums > 0)
    {
?>
        
<select name="city2" onChange="getconty();">
    
<?php
        
while($rows = $db->getRows($city2))
        {
            
echo "<option value=".$rows['cityId'];
            
echo ">".$rows['cityName']."</option>";
        }
        
echo "</select>";
    }
}
?>
<?php
 
include('../include.php');
?>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
<?php


$provinceid=$_GET['cityid'];

$sql_str = "select * from tcity where fid=$provinceid";

if($provinceid)
{
    
$city2 = $db->query($sql_str);
}
if($city2)
{
    
$nums = 0;
    
$nums = $db->getRowsNum($city2);

    
if($nums > 0)
    {
?>
        
<select name="city3" onChange=";">
    
<?php
        
while($rows = $db->getRows($city2))
        {
            
echo "<option value=".$rows['cityId'];
            
echo ">".$rows['cityName']."</option>";
        }
        
echo "</select>";
    }
}
//else
//{
//    echo "ooo";
//}

?>

PS1:所用到的数据库就是一个存放城市信息的表,有cityId,cityName,fid(上一级id)

ps2:有很相似的city,和city2..因牵扯省市县,三级,,本人愚笨,直接弄了2个getcity上去

 

 

posted @ 2010-01-14 17:41  9421  阅读(334)  评论(0编辑  收藏  举报