我可以通过ajax调用更新（不替换内容）jsp div标签内的内容吗答案

【问题标题】：Can I update (not replace content) contents inside the jsp div tag from ajax call我可以通过ajax调用更新（不替换内容）jsp div标签内的内容吗
【发布时间】：2014-10-21 18:39:58
【问题描述】：

我有一个场景，在我的 JSP 中，在一个 div 标签下，我在 scriptlet 中有一些内容，每次我从服务器收到请求时，它都会从数据库中读取数据。以前每次更新我都会刷新整个页面，它也会加载资源并且页面大小会增加，所以我想到了为什么不只更新 div 标签-

我的 div 标签示例是这样的 -

 <div id="container">
    <%
            StudentLogin name = (StudentLogin)request.getAttribute("name");
            List<Cube> personList = (List)request.getAttribute("message");

            for(Cube cube: personList){
                String usedBy =  cube.getUsedby().trim();
                boolean alreadyUsed = (usedBy.length()>0);
                String ipAddress = cube.getIp();
                String cubeName = cube.getCubename();
                String details = cube.getDetails();
                String since = "Not Busy  ";        
                String cubeCirle = "pricemid";
        %>
            <div class="<%= mainClass%> ">
            <h1> <%= ipAddress%> </h1>
            <div class="<%= cubeCirle%>"> 
                <h2> <%= cubeName%> </h2> 
             </div>
                 <div class="infos">  
                 <h3>  <%= details%> </h3>               
                 <h2>  <%= usedBody%> </h2>
                 <h3>  <%= since%> </h3>
             </div>
              <div class="<%= priceFooterClass%> ">
                <div class="<%= buttonclass%> ">
                  <a href="#" onClick="suc('<%=userName%>','<%=Password%>','<%=usedBody%>','<%=cubeName%>')"> <%= buttonName%> </a>
                </div>
              </div>
            </div>
        <% } %>
</div>

因此，对于每个 ajax 调用，我都期待 name 和 message 的新值，并基于此更新我的 div 标签。

以下是我的 ajax 调用示例-

  $.ajax({
        url: '${pageContext.request.contextPath}/usercontroller/success.json',
        data: JSON.stringify(datamodel),
        type: "POST",
        beforeSend: function(xhr) {
            xhr.setRequestHeader("Accept", "application/json");
            xhr.setRequestHeader("Content-Type", "application/json");
        },
        success: function(resp) {           
            $("#container").html(resp); 
        },
        error: function(e){  
         alert('Error121212: ' + e);  
        } 
    });

通过 ajax 调用，我意识到它只是替换了我的 div 标签内的全部内容，而不是更新或简单地调用它。它也尝试使用 load 方法，但是更新了整个页面，所以我应该怎么做才能用 update value 刷新特定 div 标签内的内容，仅此而已。

目标-

我每次都从服务器获得不同的值，其中包含名称和消息，并且基于必须更改 div 标签下的内容，所以我应该替换整个 div 命令并创建一个内部 html 来替换 div 标签做那个或什么..

【问题讨论】：

如果您想在已有内容的下方添加内容，您可能需要尝试 $("#container").append(resp);
您不能“更新”container div，因为更新它的代码驻留在服务器中，用户只会收到不知道上述模板的构造 HTML，该模板用于生成它。也许我弄错了你的要求。您能否详细说明您希望代码在“更新”中做什么

标签： javascript jquery ajax jsp scriptlet

【解决方案1】：

您必须记住，JSP 完全在服务器上处理，发送到浏览器的结果是纯 HTML。您不能只将浏览器端的 JSON 对象传递给您的 div 并期望 JSP 呈现发生。

一个快速而肮脏的解决方案是在成功回调中手动重建标记 $("#container").html("<h1>" + resp.name + "</h1>"); 等等

更复杂的解决方案是检索您尝试从服务器更新的部分的整个标记，而不仅仅是 JSON 格式的数据。或者您可以包含客户端模板解决方案。

【讨论】：