jquery切換與鏈接按鈕無法正常工作

Question

你有一個<div>標簽，它顯示一個包含 LinkBut​​ton 的 gridview 來顯示它的詳細信息，在div標簽的標題中，我有一個按鈕來切換<div ，這很好用，我希望當我點擊鏈接按鈕時的gridview，gridview 切換，使用此代碼，看起來它會工作，但它使效果切換但立即和自動再次顯示。 這是我的asp代碼

<span class="expande_button expandeSurtido" data-ref="parciales"><i class="fa fa-chevron-circle-up">
  </i>Expandir documentos</span>
  <div id="parciales">
    <asp:GridView ID="uxGridViewPartials" runat="server" AutoGenerateColumns="false" Visible="false" Width="50%" >  
       <Columns>
        <asp:BoundField DataField="documentNumber" HeaderText="Folio" ItemStyle-CssClass="tdCenter" />
        <asp:BoundField DataField="date" HeaderText="Fecha" DataFormatString="{0:d}" ItemStyle-CssClass="tdCenter"/>                                
        <asp:TemplateField HeaderText="Seleccionar">
        <ItemTemplate>
          <div class="app_acciones divCentrar">
           <asp:LinkButton ID="uxLinkButtonSeleccionar" runat="server" Visible="true" 
            CssClass="app_button contrae" data-ref="parciales"
            OnClick="uxLinkButtonSeleccionar_Click"                                            
            CausesValidation="False">Ver
            </asp:LinkButton>                            
         </div>                            
        </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="pkProductDocument"  ItemStyle-CssClass="hide" HeaderStyle-CssClass="hide" />
        </Columns>
        <HeaderStyle CssClass="HeaderStyle" />
        <RowStyle HorizontalAlign="Center" />                            
      </asp:GridView>
   </div>

這是我的js

$('#contenedor').on("click", '.expandeSurtido', function() {
    $(this).children('i').toggleClass('fa-chevron-circle-down', 'fa-chevron-circle-up');
    $idPanel = $(this).attr('data-ref');
    $('#' + $idPanel).toggle("slow");
});

$('#contenedor').on("click", '.contrae', function() {
    $idPanel = $(this).attr('data-ref');
    $('#' + $idPanel).toggle("slow");
});

提到，正如您所看到的，所有內容都包含在一個名為 contenedor 的類中

Answer 1

問題在於 ASP.NET Web 表單中的“OnClick”處理程序是服務器端函數，然后在它們完成后重新呈現頁面。

您的處理程序工作正常，但隨后立即返回服務器以處理點擊處理程序，然后重新呈現頁面（切換重置為其默認狀態）。

您不應該為此使用 LinkBut​​ton（因為它們與服務器控件密切相關）。 只需將其設為標簽： <a href="#" class="contenedor">Ver</a>並將處理程序添加到其中，它應該可以正常工作。