点击页面 事件。获取新的列表
获取列表
// 因为是测试所以请求页面和参数都写死了
PHP 部分
分为两个。一个是第一次请求的php页面,别一个是异步请求的php页面
index.php
$list = array(
array('name'=>'天宫一号确定29日晚发射
独家3D展示太空对接','url'
=>'','title'=>'sd'),
array('name'=>'已完成最后合练
中国航天近130次发射成功率94.4%','url'
=>'','title'=>'sd'),
array(...) ...
array('name'=>'七一讲话 党史上的今天 走基层
漫博会今日开幕','url'
=>'','title'=>'sd')
);
$smarty ->assign('list',$list);
$smarty->display('index.tpl');
index1.php
if($_GET['page'=='1'){
$list2 = array(
array('name'=>'全国卖地收入涨6732倍
从4.5亿飙到3万亿','url'
=>'','title'=>'sd'),
array('name'=>'公安部摧毁两特大跨国电信诈骗集团
抓获828人','url'
=>'','title'=>'sd'),
array(...),
...
array('name'=>'长春违法强拆致人死亡案嫌犯均被捕
市长再道歉','url'
=>'','title'=>'sd'),
);
}
echo json_encode($list2);
tpl 部分
{foreach from=$list item=item}
href='{$item.url}'
alt='{$item.title}'>{$item.name}
{/foreach}
id='list1'>将载新的列表
JS 部分
userAjax={
xmlhttp: new
XMLHttpRequest(),
loadXMLDoc:function(_url){
if (userAjax.xmlhttp!=null) {
userAjax.xmlhttp.onreadystatechange=userAjax.state_Change;
userAjax.xmlhttp.open("GET",_url,true);
userAjax.xmlhttp.send();
}else{
alert("Your browser does not support XMLHTTP.");
}
},
state_Change:function(){
if (userAjax.xmlhttp.readyState==4){// 4 =
"loaded"
if (userAjax.xmlhttp.status==200) {// 200 =
"OK"
ret = eval_r(userAjax.xmlhttp.responseText);
//alert(userAjax.xmlhttp.responseText);
var
q='';
for(var
i=0;i
q
= q+ '
href='+ret[i]["name"] +' alt='+ret[i]["url"]
+'>'+ret[i]["name"]
+'
';
}
document.getElementByIdx_x('list1').innerHTML = q;
}
}
}
}
个人观点:
异步交互其实很简单。只不过是创建一个XMLHttpRequest
使用get或post请求数据。
其实它就这么简单。只要你敢动手尝试,没有攻克不了的技术。做技术就怕‘眼高手低!!!!