html中使用ajax请求,jQuery中ajax请求后台返回json数据并渲染HTML的方法

该博客介绍了如何使用jQuery的AJAX方法向PHP发送GET请求,获取JSON格式的数据,并将这些数据动态渲染到HTML元素中。在PHP端,通过I('get.name')获取查询参数,然后从数据库中筛选匹配的菜品信息,最后以JSON编码形式返回给前端。前端接收到数据后,遍历JSON数组,构建HTML结构并显示在页面上。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

html实例

搜索

序号菜名

jquery实例

function seek_product(){

var product = $('.seek_product').val();

$.ajax({

type:'get',

url:'/Cash/Index/seek_product',

data:{name:product},

success:function(res){

var data = eval('('+res+')');

var len = data.length;

var cm = "";

if(len > 0){

for(var i = 0; i < len; i++){

cm += '

';

cm += '

';

cm += i+1;

cm += '

';

cm += '

';

cm += '

'+data[i]["name"]+'

';

cm += '

';

cm += '

';

console.log(cm);

$('.restaurant_food').html(cm);

}

}else{

$('.restaurant_food').html('抱歉,没有这道菜!');

}

}

})

}

php实例

//搜索菜

public function seek_product(){

$shop_id = session("cashShopId");

$name = I('get.name');

$map['name'] = array('like','%'.$name.'%');

$map['shop_id'] = $shop_id;

$map['status'] = 1;

$productList = M('product')->field('id,name')->where($map)->select();

echo json_encode($productList);

}

以上这篇jQuery中ajax请求后台返回json数据并渲染HTML的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值