datalist控件内的jquery函数

Question

$(function () {
  $('a.detials').on('click', function (ev) {
    $(this).next('div').toggle();
  });
});

这里的问题是我想在点击锚标记时调整 div。但我的代码有问题我没有什么问题。我在谷歌上搜索以达到这个结果，当我点击锚点时标记 div 未打开，我需要帮助。

$( 函数 () { $('a.detials').on('click', function() { $('+ div', this).toggle();`` }); });

<asp:DataList ID="dtlRoomsPrice" Visible="false" orizontalAlign="center" runat="server" ShowFooter="False" ShowHeader="False" Width="700px" OnItemDataBound="dtlRoomsDetails_ItemDataBound">
    <ItemTemplate>
         <a href="javascript:void(0);" class="detials">ShowDetails</a>
   <div class="shoow" id="div_ID" style="width:687px;height:110px;background-color:rgb(247,239, 216);border-radius: 5px;box-shadow: 7px 6px 5px #888888; border: 2px solid gray; display:none;padding: 5px; ">
                <asp:Label ID="lblAmiintiesTxt" runat="Server" CssClass="shbe_label" Text="<%$ Resources:Resource,Amenities %>" Visible="false"></asp:Label>
                <asp:Label ID="lblAmiinties" runat="Server" CssClass="shbe_h2" Text='<%# Eval("Amenities") %>' Visible="true"></asp:Label>
            </div>
        </ItemTemplate>
    </asp:DataList>

Answer 1

因为没有为第一次点击分配点击处理程序。这就是正在发生的事情：

1. 用户点击元素
2. 函数togglee被调用
3. 为元素分配了一个点击处理程序
4. 用户再次点击元素
5. 点击处理程序被调用（您希望在第一次点击中发生的事情）
6. （另外，另一个点击处理程序是通过再次调用 togglee 添加的。这绝对不是你想要的。）

我不确定你为什么要使用这个togglee 函数，但你不需要它。从元素中移除内联 JavaScript：

<a href="javascript:void(0);" class="detials">ShowDetails</a>

并在页面加载时分配点击处理程序：

$(function () {
    $('a.detials').on('click', function() {
        $('+ div', this).toggle();
    });
});

然后对该元素的第一次点击（以及任何后续点击）将调用该点击处理程序。