Ajax实现不刷新取最新商品
话不多说，请看代码：
<?php
$conn=mysql_connect('localhost','root','123456')ordie('连接失败');
mysql_select_db('ecshop');
mysql_query('setnamesutf8');
$attr=isset($_GET['attr'])?$_GET['attr']:'is_hot';//由html的ajax提交过来然后根据它来取数据~
$sql='selectgoods_name,goods_id,shop_pricefromgoodswhere'.$attr.'=1limit0,3';
$rs=mysql_query($sql,$conn);
//var_dump($rs);
$goods=array();
while($row=mysql_fetch_assoc($rs)){
$goods[]=$row;
}
//print_r($goods);
?>
<tableborder='1'>//ajax接收的就是php输出内容虽然它没echo但也是输出在网页的内容所以ajax能接收~~！！！
<tr><td>商品ID</td><td>商品名称</td><td>商品价格</td></tr>
<?phpforeach($goodsas$v){?>
<tr>
<td><?phpecho$v['goods_id'];?></td>
<td><?phpecho$v['goods_name'];?></td>
<td><?phpecho$v['shop_price'];?></td>
</tr>
<?php}?>
</table>
HTML的内容
<script>
varxhr=newXMLHttpRequest();
functiontop3(attr){
varurl='goods.php?attr='+attr;
xhr.open('get',url);
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
vardobj=document.getElementsByTagName('div')[0].innerHTML=xhr.responseText;//把从php接收的内容放入INNERHTML
}
}
xhr.send();
}
</script>
</head>
<body>
<inputtype="button"value="最新商品"onclick="top3('is_new');">
<inputtype="button"value="热卖商品"onclick="top3('is_hot');">
<inputtype="button"value="精品商品"onclick="top3('is_best');">
<divid="test">
</div>
</body>
实例2：根据输入的ID获取商品信息并修改
<?php
$conn=mysql_connect('localhost','root','123456')ordie('连接失败');
mysql_select_db('ecshop');
mysql_query('setnamesutf8');
$id=isset($_GET['id'])?$_GET['id']:1;
if($id==''){
$error['num']=1;
$error['msg'];
}
$sql='selectgoods_id,goods_name,shop_price,goods_numberfromgoodswheregoods_id='.$id;
$rs=mysql_query($sql);
if(!($goods=mysql_fetch_assoc($rs))){//获取不到商品就返回false
echo'没有该商品！';
exit;
}
echojson_encode($goods);//把数组转成一个json格式~~
?>
HTML端的内容
<script>
varxhr=newXMLHttpRequest();
functionmodify(){
varinputs=document.getElementsByTagName('input')
vargid=inputs[0].value;
varurl='search.php?id='+gid；
xhr.open('get',url);
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
vardata=eval('('+xhr.responseText+')')//把接收到的json格式数据转成JS的对象！
inputs[1].value=data.goods_name;
inputs[2].value=data.goods_number;
inputs[3].value=data.shop_price;
}
}
xhr.send(null)//经常漏写了~~~不写是发送不了请求的~~一定要写！
}
</script>
</head>
<body>
<h1>商品编辑</h1>
商品id:<inputtype="text"name="goods_id"onfocus="al()"onblur="modify();"/><br/><span></span>
商品名称:<inputtype="text"name="goods_name"/><br/>
商品库存:<inputtype="text"name="goods_number"/><br/>
商品价格:<inputtype="text"name="shop_price"/><br/>
<inputtype="submit"value="修改"/>
</body>
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持毛票票！