使用jQuery選擇下拉選項後顯示隱藏的字段集

Question

這裏的目標是隱藏「狀態錦標賽」字段集，除非從下拉列表中選擇狀態錦標賽。這適用於jSFiddle，但由於某種原因，它不適用於實時頁面。

請幫忙。

相關CSS/JS代碼：

<style type="text/css"> 
    #state-championships-1409369394 { 
    display:none 
    } 
</style> 

<script type="text/javascript">//<![CDATA[ 
$(window).load(function(){ 
$(document).ready(function() { 
    $('#DROPDOWN_21-3-0-1').on('change', function() { 
     if (this.value == 'State Championships') { 
      $("#state-championships-1409369394").show(); 
     } else { 
      $("#state-championships-1409369394").hide(); 
     } 
    }); 
}); 
});//]]> 
</script> 

相關的HTML代碼

<select name="DROPDOWN_21" title="Must choose an event to register for." class="required ee-reg-page-questions DROPDOWN_21 valid" id="DROPDOWN_21-3-0-1"> 
    <option value="">Select One</option> 
    <option value="Main Event">Main Event</option> 
    <option value="State Championships">State Championships</option> 
</select> 

<fieldset class="event_questions" id="state-championships-1409369394"> 
    <h4 class="reg-quest-title section-title">State Championships</h4> 
    <div class="event_form_field"> 
     <label for="TEXT_18" class="ee-reg-page-questions">Qualifying Total</label> 
     <input type="text" class="ee-reg-page-questions ee-reg-page-text-input TEXT_18" id="TEXT_18-3-0-1" name="TEXT_18" value=""> 
    </div> 
    <div class="event_form_field"> 
     <label for="TEXT_19" class="ee-reg-page-questions">Event Name for Qualifying Ttoal</label> 
     <input type="text" class="ee-reg-page-questions ee-reg-page-text-input TEXT_19" id="TEXT_19-3-0-1" name="TEXT_19" value=""> 
    </div> 
    <div class="event_form_field event-quest-group-textarea"> 
     <label for="TEXTAREA_20" class="ee-reg-page-questions">Date of Event</label> 
     <textarea class="ee-reg-page-questions ee-reg-page-text-input TEXTAREA_20" id="TEXTAREA_20-3-0-1" name="TEXTAREA_20" rows="5"></textarea> 
    </div> 
</fieldset> 

鏈接的jsfiddle：http://jsfiddle.net/v4gNL/100/
鏈接到活動網站：http://bit.ly/1qeet9A

Answer 1

使用jQuery代替$：

jQuery('#DROPDOWN_21-3-0-1').on('change', function() { 
     if (this.value == 'State Championships') { 
      jQuery("#state-championships-1409369394").show(); 
     } else { 
      jQuery("#state-championships-1409369394").hide(); 
     } 
    }); 

可以在控制檯中運行上面的腳本和查詢。