Сбой простой задачи jQuery: скрыть дочерние элементы тега <div>

Question

Для этого должно быть простое объяснение.

У меня есть родительский тег <div>, содержащий количество дочерних элементов div, которые необходимо скрыть в зависимости от их класса. Проблема в том, что я даже не могу справиться с моим родительским div. В чем здесь проблема? Я ухожу из своей тыквы.

Код jQuery (фрагмент) выглядит следующим образом:

$(function() {
    $('#dasummary').children().hide();

Оскорбляющий раздел <div> и все его содержимое выглядит следующим образом:

<asp:ListView ID="lvLedger" runat="server" DataSourceID="ldsLedger">
    <LayoutTemplate>
        <h2>Current Day Activity Summary</h2>
        <div id="#dasummary">
            <div id="itemPlaceholder" runat="server" />
        </div>
    </LayoutTemplate>
    <ItemTemplate>
        <div id="toggleRow" runat="server" class="group">
            <asp:Image ID="imgToggle" runat="server" 
                ImageUrl="~/App_Themes/SunDIAL/images/maximize.png"
                ImageAlign="Left" />
            <%# Eval("Key") %> (<%# Eval("Count") %> entries)
        </div>

        <!-- Add nested ListView control for individual items here -->
        <asp:ListView ID="lvItems" runat="server" DataSource='<%# Eval("Tasks") %>'>
            <LayoutTemplate>
                <div class="activity_summary">
                    <table>
                        <thead>
                            <tr>
                                <th class="first" />
                                <th>Day</th>
                                <th>Job</th>
                                <th>Batch</th>
                                <th>Duration</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr id="itemPlaceholder" runat="server" />
                        </tbody>
                    </table>
                </div>
            </LayoutTemplate>
            <ItemTemplate>
                <tr id="item" runat="server" class="itemRow">
                    <td class="first" />
                    <td>
                        <h4>
                            <a><%# Eval("Day") %></a>
                        </h4> 
                    </td>
                    <td><%# Eval("Project") %></td>
                    <td><%# Eval("Name")%></td>
                    <td><%# Eval("Hours") %>:<%# Eval("Minutes","{0:00}") %></td>
                </tr>
            </ItemTemplate>
        </asp:ListView>

    </ItemTemplate>
</asp:ListView>

Визуализированный HTML выглядит (насколько я вижу) просто отлично. Дайте мне знать, если вы хотите все это; вот важный бит:

<div id="#dasummary">

        <div id="ctl00_ContentPlaceHolder1_dashboardFrame_ctl00_ActiveDayLedger1_lvLedger_ctrl0_toggleRow" class="group">
            <img id="ctl00_ContentPlaceHolder1_dashboardFrame_ctl00_ActiveDayLedger1_lvLedger_ctrl0_imgToggle" src="App_Themes/SunDIAL/images/maximize.png" align="left" style="border-width:0px;" />
            Wednesday (2 entries)
        </div>


        <!-- Add nested ListView control for individual items here -->

                <div class="activity_summary">

Должна быть причина, по которой я терплю неудачу в такой простой операции. Вы можете это заметить?

Answer 1

Идентификатор вашего div неверен. В HTML это должно быть dasummary, а не #dasummary, поэтому вы можете получить его с помощью jQuery с помощью $("#dasummary")

Answer 2

"#" в селекторе jQuery означает, что jQuery должен выбирать элементы по id. Итак, в вашем случае есть два способа:

1. Использовать идентификатор без "#"
2. Измените запрос jQuery на что-то вроде "## dasummary". Это должно работать.

Answer 3

Правильно, у вас должно быть

<div id="dasummary">

Также может потребоваться использовать каждую функцию:

$("div", "#dasummary").each(function() {
   $(this).hide();
});