如何根據JSP中的SELECT標籤值顯示選項卡？

Question

嗨我已經創建了一個JSP頁面。第一個選項卡包含一個SELECT字段。根據所選值，我想顯示下一個選項卡。任何人都可以幫助我嗎？我嘗試了很多次，但我沒有得到。

<div class="navbar btn-navbar"> 
     <div id="tabs" class="tabbable"> 
      <ul id="myTab" class="nav nav-tabs"> 
       <li class="active"><a href="#datacollector" target="main" 
        data-toggle="tab">Data Collector</a></li> 
       <li class="hidden"><a href="#fromDB" target="main" 
        data-toggle="tab">Data Load</a></li> 
       <li class="hidden"><a href="#fromFile" target="main" 
        data-toggle="tab">Data Load</a></li> 
       <li class="hidden"><a href="#email" target="main" 
        data-toggle="tab">Data Load</a></li> 
       <li><a href="ajax/DataFieldMapping.jsp" target="main" data-toggle="tab">Data 
         Map</a></li> 
       <li><a href="#schedule" target="main" data-toggle="tab">Schedule</a></li> 
      </ul> 
      <br> <br> <br> 
      <div id="myTabContent" class="tab-content"> 
       <div class="tab-pane fade in active" id="datacollector"> 
        <div class="container"> 
         <div class="row"> 
          <div class="span8"> 
           <form name="selectType" action="selectType" 
            onsubmit="return validateForm()" target="#fromDB" method="get"> 
            <fieldset> 

             </select> <label class="control-label" for="dataloadType">Data 
              load Type:</label> <select id="dataloadType" name="dataloadType"> 
              <option>Choose Data load Type</option> 
              <option value="fromDB">From Database</option> 
              <option value="fromFile">From File</option> 
              <option value="email">E-mail</option> 
              <option value="webServices">Web Services</option> 
             </select> 
             <p> 
              <button id="nexttab" type="submit" class="btn btn-success">Submit</button> 
             </p> 
            </fieldset> 
           </form> 
          </div> 
         </div> 
        </div> 
       </div> 
       <div class="tab-pane fade" id="fromDB"> 
        <iframe src="GenericFileUpload.jsp" width="1250" height="400"></iframe> 
       </div> 
       <div class="tab-pane fade" id="fromFile"> 
        <iframe src="GenericDB.jsp" width="1250" height="400"></iframe> 
       </div> 
       <div class="tab-pane fade" id="email"> 
        <iframe src="EmailService.jsp" width="1250" height="400"></iframe> 
       </div> 
       <div class="tab-pane fade" id="datamap"> 
        <iframe src="DataFieldMapping.jsp" width="1250" height="400"></iframe> 
       </div> 
       <div class="tab-pane fade" id="schedule"> 
        <iframe src="UploadConfiguration.jsp" width="1250" height="400"></iframe> 
       </div> 
      </div> 
     </div> 
    </div> 

如果用戶從文件選擇要顯示以ID FROMFILE下一個標籤，也應該隱藏與IDS fromDB和電子郵件的標籤。有人可以幫我嗎？ 如何使用jquery？

Answer 1

How to make a DIV visible and invisible with JavaScript

只是爲了附加到這一點：

onchange事件應該有一個Java腳本函數進行註冊。該功能將讀取選擇框中的當前選定值。

根據該值，只顯示需要的div，然後全部隱藏。

Answer 2

$('#dataloadType').live('change',function(){ 
    var value = $(this).val(); 
    $('#tabs').tabs('select',value); 
});