Question

我在Struts2 jQuery中使用了标签。我想在第一个标签的末尾有一个NEXT按钮，点击后可以移动到下一个标签。但是，当我这样做时，在按钮单击时，div仅出现在URL中。它会在页面刷新时加载。代码如下：

<form action="applyhere" method="post" id="companyapply">
<sj:tabbedpanel id="localtabs" cssClass="list">
    <sj:tab id="tab1" target="tone" label="Personal Information"/>
     <sj:tab id="tab2" target="ttwo" label="Educational Qualifications"/>
     <sj:tab id="tab3" target="tthree" label="Local Tab Three"/>
     <sj:tab id="tab4" target="tfour" label="Local Tab Four"/>
</sj:tabbedpanel>

<div id="tone">
<table>
  <p style="font-size: small; color: red; float: right;">*required fields</p>    
  <tr>
    <td>Enter Firstname: *</td>
    <td><input type="text" name="firstname" required
        value=<s:property value="#session.USERNAME"/> /></td>
        <input type="button" onclick="#ttwo"/><!-- onclick the button should link to the next div having an id TTWO. It shows the URL in the link, but the next tab gets loaded only when the page is refreshed. -->
  </tr>
</table>    
</div>

<div id="ttwo">
<table>
<p style="font-size: small; color: red; float: right;">*required fields</p>

<tr>
<td></td>
</tr>
</table>

Answer 1

您应该发布主题以导航到下一个标签。如果您将此按钮用于导航

<sj:a href="#" onClickTopics="nextTopic" button="true">Next</sj:a>

侦听它的代码应该是订阅处理程序

$(function(){
  $.subscribe('nextTopic', function(event, data) {
    var size = $("#localtabs").find(">ul >li").size();
    var active = $("#localtabs").tabs('option', 'active');
    $("#localtabs").tabs('option', 'active', active + 1 >= size ? 0: active + 1);
  });
});

按钮导航到Struts 2 jQuery tabbedpanel中的不同选项卡

1 个答案: