html页面中ajax请求数据类型,Jquery ajax请求返回html数据类型

本文介绍如何使用JQuery AJAX进行异步请求获取HTML页面,并展示了具体的前端和后端实现代码。通过AJAX传参请求后台获取HTML页面并完成渲染。

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

Jquery ajax 异步请求返回 html

本文简述通过ajax传参请求后台获取html页面并渲染。

ftl页面代码

1.代码如下:

${infoColumn.name}

2.页面js如下: function show(columnId){ $("span").removeClass(); $("#trainedTableLable").addClass("tab_blue"); $("#noticeContent p").remove(); if($("#noticeContent li").length>0){ $("#noticeContent li").remove(); } var params = {columnId:columnId,ranNum: Math.random()}; var targetUrl = encodeURI("${request.getContextPath()}/infocontent/infoContent/loadInfoContentByColumnId"); $.ajax({ type : "post", url : targetUrl, dataType : "html", data : params, async:false, success : function(html) { $("#noticeContent").append(html); } }); }

java代码

1.代码如下: @RequestMapping(value = "/loadInfoContentByColumnId") public String loadInfoContentByColumnId(@RequestParam(value = "columnId", required = true) Long columnId ,Model model) { InfoContent infoContent = new InfoContent(); infoContent.setColumnId(columnId); infoContent.setPageParameter(getpagePageParameterForNotice()); //根据栏目分类查询类目内容 Pagination pagination = infoContentService.getInfoContentByColumnId(infoContent); model.addAttribute("page", pagination); model.addAttribute("infoContentList", pagination.getList()); return "modules/user/notice"; }

返回html页面如下

1.notice.ftl页面如下:

${infoContent.title}imgtop.png ${infoContent.updateDateString} ${infoContent.title} ${infoContent.updateDateString} #if> #list> #if>

注:以上仅作为流程性参考,具体代码不具有真实意义,仅供参考。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值