如何在同一jsp页面中的spring mvc中从控制器的选项卡单击动态加载数据？答案

【问题标题】：How to load data dynamically on tab click from controller in spring mvc in same jsp page?如何在同一jsp页面中的spring mvc中从控制器的选项卡单击动态加载数据？
【发布时间】：2015-07-17 16:22:28
【问题描述】：

我正在使用 Ajax/jquery 在单击选项卡后重新加载页面的一个部分，但是当我运行代码时，新的 jsp 正在显示...

JSP 页面

<ul class="nav nav-tabs tabs-up" id="friends">
      <li><a href="/area" data-target="#contacts" class="media_node active span" id="contacts_tab" data-toggle="tabajax" rel="tooltip"> Contacts </a></li>
      <li><a href="/gh/gist/response.html/3843301/" data-target="#friends_list" class="media_node span" id="friends_list_tab" data-toggle="tabajax" rel="tooltip"> Friends list</a></li>
      <li><a href="/gh/gist/response.html/3843306/" data-target="#awaiting_request" class="media_node span" id="awaiting_request_tab" data-toggle="tabajax" rel="tooltip">Awaiting request</a></li>
</ul>

<div class="tab-content">
<div class="tab-pane active" id="area">
<%@ include file="areas.jsp" %>
</div>
<div class="tab-pane" id="friends_list">
</div>
<div class="tab-pane  urlbox span8" id="awaiting_request">
</div>
</div>

ajax 调用

$('[data-toggle="tabajax"]').click(function(e) {
    var $this = $(this),
        loadurl = $this.attr('href'),
        targ = $this.attr('data-target');

    $.get(loadurl, function(data) {
        $(targ).html(data);
    });

    $this.tab('show');
    return false;
});

控制器

@RequestMapping("/area")
public ModelAndView noticesAjaxRequest(ModelMap model) {

    String str="a";

    return new ModelAndView("areas", "str", str);
}

但是当我运行这段代码时，我只会得到 area.jsp 作为输出。

【问题讨论】：

标签： java ajax spring

【解决方案1】：

问题是您的<a> 元素中仍然有href 属性。

更改<a href="/area" ...

致<a href="" ...

您必须将链接存储在另一个属性中（例如 data-href）。

【讨论】：

您可以将链接存储在另一个属性中，例如data-href。
我的控制器是正确的？？因为我正在从浏览器上的控制器返回视图，还是必须返回其他内容？
不，这很好，因为您将从控制器获得的 HTML 直接插入到您的主页中。
或者控制器返回的视图是否会放在div中。
是的，我想是的，这就是$(targ).html(data); 的用途。