顯示基於復選框控件的隱藏ASP面板不起作用

Question

我試圖基於復選框控件中選中的復選框顯示/隱藏ASP面板。

HTML代碼

    <asp:Panel runat="server" ID ="ESYLaterControl" CssClass="ESYLaterControl">
  <tr>
     <td style="padding-top: 10px;padding-left: 0px">
     <asp:CheckBox runat="server" ID="chkbxesylater" CssClass="chbxESYLater"  OnCheckedChanged="PageModified"/>
    <uc3:DateControl ID="Dtctrlesylaterdate" class="dtctrESY" runat="server"/>
    </td>
</tr>
 <tr>
<td id="explainESYLater" style="padding-top: 10px">
    &nbsp;Explain
    </td>
</tr>
<tr>
<td style="padding-left: 3px">
     <asp:TextBox runat="server" ID="txtesylater" Class ="txtbxESY" Width="100%" TextMode="MultiLine"></asp:TextBox>
    </td>
</tr>
</asp:Panel>

腳本

<script type="text/javascript">
$(document).ready(function () {
    $(function() {

        var $ESYYes = $('#<%= YesNoControlESY.GetYesClientID() %>');
        var $ESYno = $('#<%= YesNoControlESY.GetNoClientID() %>');
        var $panel = $('.ESYLaterControl');

        $ESYYes.change(function () {
            if ($panel != null && $ESYYes != null)
                 if($ESYYes.is(':checked')) {
                    panel.style.display = 'block';
                } else {
                    panel.style.display = 'none';
                }
        });
       });

});

當我在Firebug中調試代碼時，它會進入if塊if（$ ESYYes.is（'：checked'））的內部，但不會顯示或隱藏面板。

Answer 1

代替

panel.style.display = 'block'和panel.style.display = 'none';

嘗試

$panel.show(); 和$panel.hide();

Answer 2

$ panel缺少$前綴。 在if / else塊中的變量是“ panel”。