新しいdivタグを開くときに自動的にdivタグを閉じるには

Question

GridViewコントロールに複数のa linkとdiv tagsを動的に生成するGridViewコントロールがあります。
私の要件は次のとおりです。50以上のGridViewの表示が記録
場合、私は再び詳細にそのショーの最初の行のdivタグFirstName and LastNameレコードをリンクする最初の行ショーのアンカーをクリックしたとき、私は任意の行a anchorをクリックすると、その50 a linkとdivタグを生成しますリンクが最初に開かれたdiv tagsが自動的に閉じられ、新しい行タグが開かれたdivタグが開かれました。

<asp:GridView ID="GridParent" runat="server"> 
    <Columns> 
     <asp:TemplateField> 
     <ItemTemplate> 
      <table> 
      <tr> 
      <td> 
       Username : <%# Eval("Username") %> 
       <a href="#" onclick="ShowDiv(this);">Show</a> 
       <div id="div1" style='display:none;'> 
       First Name: <%# Eval("FirstName") %> 
       Last Name: <%# Eval("LastName") %> 
       </div> 
      </td> 
      </tr> 
      </table> 
     </ItemTemplate> 
     </asp:TemplateField> 
    </Columns> 
    </asp:GridView> 

Answer 1

$('a').click(function() { 
 
    $('.more-info').css('display', 'none'); 
 
    $(this).next().css('display', 'block'); 
 
});

.more-info { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td> 
 
     Username : "Username" 
 
     <a href="javascript:void(0)">Show</a> 
 
     <div id="div1" class="more-info"> 
 
     First Name: "FirstName" Last Name: "LastName" 
 
     </div> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     Username : "Username" 
 
     <a href="javascript:void(0)">Show</a> 
 
     <div id="div2" class="more-info"> 
 
     First Name: "FirstName" Last Name: "LastName" 
 
     </div> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     Username : "Username" 
 
     <a href="javascript:void(0)">Show</a> 
 
     <div id="div3" class="more-info"> 
 
     First Name: "FirstName" Last Name: "LastName" 
 
     </div> 
 
    </td> 
 
    </tr> 
 
</table>

...これを試してみてください