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

网络编程 2025-03-13 16:13www.168986.cn编程入门

在前端开发中,利用jQuery中的ajax进行后台请求并渲染HTML内容是一种常见的技术手段。长沙网络推广在此分享一篇具体的实例教程,希望能对大家有所帮助。

让我们看一下PHP部分。这是一个名为`seek_product`的公共函数,它从前端获取搜索关键词,根据搜索关键词和店铺ID等信息从数据库中查询产品,并将查询结果以json格式返回给前端。

具体实现过程如下:

HTML部分:

```html

序号 菜名

```

jQuery部分:

```javascript

function seek_product(){

var product = $('.seek_product').val(); // 获取输入框中的值

$.ajax({

type:'get', // 请求方式

url:'/Cash/Index/seek_product', // 请求地址

data:{name:product}, // 发送的数据

success:function(res){ // 请求成功后的回调函数

var data = JSON.parse(res); // 返回的数据为JSON格式

var cm = ""; // 用于拼接HTML代码的变量

if(data.length > 0){ // 如果有数据返回

cm += ''; // 开始行标签并设置data-id属性为产品ID

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by