0

我有三个带有 href 链接的标签，

<ul >
        <li class="active">
            <a href="#tab_0" id="tab1" data-toggle="tab">Search by Booking ID</a>
        </li>
        <li>
            <a href="#tab_1" id="tab2" data-toggle="tab">Today's Booking</a>
        </li>
        <li>
            <a href="#tab_2" id="tab3" data-toggle="tab">Search by Date</a>
        </li>
</ul>

在每个选项卡中提交表单时，我将一个值传递给服务器以了解我选择了哪个选项卡，使用隐藏输入字段 < input type=hidden value="tab1" id="view"/>。我想要的是在 jsp 页面上获得相同的值并在页面加载时选择相应的选项卡。我正在使用 Spring 框架。我尝试在 ModelAndView 中添加一个额外的对象，比如

ModelAndView model = new ModelAndView();
model.addObject("view", view);

脚本代码是：

$(document).ready(function() {
       var activeTab = ${view};

       if(activeTab == "tab1"){
           $("#tab1").click();

       } else if(activeTab == "tab2"){
           $("#tab2").click();

       }else if(activeTab == "tab3"){
           $("#tab3").click();

       }else{
            $("#tab1").click();
       }
    });

但这不起作用。：（ 请帮忙。

4

1 回答 1

1

你不需要JavaScript代码。由于您已经view在响应中添加了值，因此您可以使用el仅active在 JSP 文件中为指定选项卡强制执行 css 类，如下所示

<ul >
    <li ${view eq "tab1"?'class="active"':''}>
        <a href="#tab_0" id="tab1" data-toggle="tab">Search by Booking ID</a>
    </li>
    <li ${view eq "tab2"?'class="active"':''}>
        <a href="#tab_1" id="tab2" data-toggle="tab">Today's Booking</a>
    </li>
    <li ${view eq "tab3"?'class="active"':''}>
        <a href="#tab_2" id="tab3" data-toggle="tab">Search by Date</a>
    </li>
</ul>
于 2017-04-14T14:44:01.780 回答