jsp页面发送ajax请求实例

最新推荐文章于 2025-07-06 15:26:28 发布

浅^醉

最新推荐文章于 2025-07-06 15:26:28 发布

阅读量1.1w

点赞数 3

CC 4.0 BY-SA版权

分类专栏： js学习

本文链接：https://blog.youkuaiyun.com/u010964820/article/details/9624173

js学习专栏收录该内容

4 篇文章

订阅专栏

本文展示了如何在jsp页面中利用jQuery的Ajax函数发送POST请求，向服务器'/internate/allProduct.action'获取数据。请求参数为'limit'，成功回调中将接收到的JSON数据转化为HTML并渲染到页面的'#all'部分。后端使用Servlet处理请求，读取'limit'参数，通过DAO层获取产品列表，并将结果转换为JSON字符串返回。

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

jsp页面加载完毕发送ajax请求：

$(function() {
$.ajax( {
url : '/internate/allProduct.action',
type : 'post',
data:{'limit':8},
success : function(data) {
var html="<ul class='clearfix'>";
for(var i=0;i<data.length;i++){
html+="<li> <a href='products.jsp' title='"+data[i].product_name+"'><img src='uploadfile/"+data[i].product_image+"' alt='"+data[i].product_name+"' width='154' height='110' /><span>"+data[i].product_name+"</span> </a></li>";
}
html+="</ul>";
$("#all").html(html);
},
dataType : 'json'
});
});

后台程序处理：

if(path.equals("allProduct")){
int limit=Integer.parseInt(request.getParameter("limit"));
System.out.println(limit);
IndexDAO dao=new IndexDAOImpl();
List<Product> proList=new ArrayList<Product>();
try {
proList=dao.allProduct(limit);
} catch (Exception e) {
System.out.println("数据库异常！");
e.printStackTrace();
}
JSONArray obj=JSONArray.fromObject(proList);
out.print(obj.toString());
}