javascript - struts2 jquery 表仅显示在第一个选项卡上

Question

我有一个包含 7 个选项卡的 div。每个表格都包含一个链接，单击该链接将显示一个包含表格的 div。这适用于第一个选项卡并很好地显示 div。但是，当您转到任何其他选项卡时，该 div 不会显示。我认为这是 javascript 的问题，我想知道您是否可以告诉我是否可以在 jquery 中选择唯一选项卡上的 div？

用于填充表的操作

<sj:tabbedpanel id="leadHomeAppTabs" cssClass="testing" useSelectedTabCookie="true">
    <s:iterator id="director" value="directorModel.directorList" status="directorStat">
        <s:set var="i" name="counter" value="#directorStat.count" />
        <s:url action="directorSummaryView.action" var="directorSummaryViewUrl">
            <s:param name="directorModel.directorListIndex" value="%{#directorStat.index}" />
        </s:url>

        <sj:div cssClass="test" label="%{#director.lineOfBusiness}" theme="simple" 
        labelposition="top" id="directorTab%{counter}" loadingText="Loading Line of Business Information..." 
        showLoadingText="true" href="%{directorSummaryViewUrl}" refreshOnShow="false3" preload="false" showErrorTransportText="false" />

        <sj:tab id="%{#director.lineOfBusiness}" target="directorTab%{counter}" label="%{#director.lineOfBusiness}"/>
    </s:iterator>
</sj:tabbedpanel>

调用 javascript 来显示 div 的链接

<sj:a href="#" onClick="javascript:showDivs('div2');">
    <s:property value="directorModel.directorScore.getCountAtLevel(2)"/>
</sj:a>

我想显示的表格(在每个选项卡上将被称为 div2，我认为这会导致问题，但选项卡的填充方式迫使它以这种方式运行)。

<sj:div id="div2" cssStyle="display:none">
    <table class="table table-striped platform-sum-table" >
        <thead>
            <th>Level</th>
            <th>Application Name</th>
            <th>ID</th>
            <th>Current Score</th>
            <th>Maximum Score</th>
        </thead>
        <tbody>
            <s:property escapeHtml="false" value="directorModel.directorScore.getAppListAtLevel(0)"></s:property>
        </tbody>
    </table>
</sj:div>

JavaScript

<script type="text/javascript">
    function showDivs(id) {
        $("#div2").toggle();}   
</script>

Answer 1

供将来引用:id 不是唯一的，因此我使用 OGNL 使其唯一

<s:set id="dirName" value="directorModel.directorScore.directorName"/>
<sj:div id="%{dirName}div2" cssStyle="display:none">
    <table class="table table-striped platform-sum-table" >
        <thead>
            <th>Level</th>
            <th>Application Name</th>
            <th>ID</th>
            <th>Current Score</th>
            <th>Maximum Score</th>
        </thead>
    <tbody>
        <s:property escapeHtml="false" value="directorModel.directorScore.getAppListAtLevel(0)"></s:property>
    </tbody>
</table>
</sj:div>