java中调用ajax返回html格式

最新推荐文章于 2024-07-02 05:00:12 发布

原创最新推荐文章于 2024-07-02 05:00:12 发布 · 2.8k 阅读

0 ·

CC 4.0 BY-SA版权

java web开发专栏收录该内容

18 篇文章

订阅专栏

本文介绍了在Java Web开发中，如何从服务器端通过Ajax请求返回HTML内容到客户端的实现过程，包括在JSP页面中发起Ajax请求以及后台Java处理和响应HTML片段的方法。

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

1.在jsp页面中

<%@ page language="java" contentType="text/html; charset=GBK"
    pageEncoding="GBK"%>
<%@ taglib uri="webwork" prefix="ww" %>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Inser here</title>
<script src="/js/jquery-1.8.1.js" type="text/javascript"></script>
<script type="text/javascript">

//回调函数
function callback(data){
    $("#checkmenunamespan").html("");
    $("#checkmenunamespan").html(data);
}

function search(id){
     var parentName = id;
     var params = "aboutId=" + parentName;
    $.ajax({
       type:"POST",             
       url:"/aboutlistAction.action?actionType=detailAbout",
       dataType:"html",
       data: params,
       success:callback,
      
      });
    
}
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0"  style="margin-top:20px;">
            <tr>
              <td class="t2">关于我们 →</td>
            </tr>
            <tr>
              <td><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" style="margin-top:10px;">
                
                <ww:if test="aboutlist3 != null">
                <ww:iterator value="aboutlist3">
                <div>  <a href="javascript:search(<ww:property value='id'/>);" ><ww:property value="title"/></a></div>
                </ww:iterator>
                </ww:if>
               <ww:else>暂无数据</ww:else>
              </table></td>
            </tr>
          </table>
          <br />
</body>
</html>

在配置模块

<!-- 关于我们模块 -->
<action name="aboutlistAction" class="com.hxxy.pub.action.AboutAction">
    <result name="detail_about" type="dispatcher">/ajax_about.jsp</result>
</action>

action里面的相关代码

package com.hxxy.pub.action;

import java.sql.SQLException;
import java.util.List;

import com.hxxy.framework.BaseAction;
import com.hxxy.pojo.About;
import com.hxxy.pojo.News;
import com.hxxy.query.QueryAbout;
import com.hxxy.query.QueryNews;
import com.hxxy.service.AboutService;
import com.hxxy.service.NewsService;
import com.sun.xml.internal.messaging.saaj.packaging.mime.util.QEncoderStream;

public class AboutAction extends BaseAction {

    private static final long serialVersionUID = 1L;
    private AboutService aboutService;
    private About about;
    private QueryAbout queryAbout;
    private String actionType;

    private int aboutId;
    private List<QueryAbout> aboutlist3;

    public String execute() throws SQLException {

        // 根据id查询新闻
        if (actionType != null && actionType.equals("detailAbout")) {
            about = aboutService.QueryAboutInfoByid(aboutId);
            if (about != null)
                return "detail_about";
            else
                return "error";
        }
        return "error";
    }
}