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.主页面
/*
* 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代码:
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中转向的页面
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>";
}
}
?>
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上去