Jquery 如何在服务器控件中生成目标客户端单击？

到目前为止，我一直在纯使用ASP.NET，但对于AJAX工具包在动画方面的限制，我感到很沮丧，所以从昨天开始，我一直在考虑使用Jquery来丰富我的UI。请记住，在Jquery和客户端脚本方面，我是一个完全的新手

我目前有一个列表视图，显示我正在编写的报告的段落，如下所示：

<div class="projectNotesListOverall">

            <asp:ListView ID="lvProjectNotes" runat="server" DataSourceID="dsProjectNotes" DataKeyNames="Note_ID" OnItemDataBound="lvProjectNotes_ItemDataBound" OnPreRender="lvProjectNotes_PreRender" OnItemCommand="lvProjectNotes_ItemCommand" >

                <ItemTemplate>

                    <div class="projectNotesNoteContainer" >

                        <div class="projectNotesNoteTitleContainer">
                            <div class="projectNotesTitleInfo" >
                                <asp:Label ID="note_OrderLabel" runat="server" Text='<%# Eval("Note_Order") + ". " %>' CssClass="projectNotesNoteTitleLabel" />
                                <asp:Label ID="Note_TitleLabel" runat="server" Text='<%# Eval("Note_Title") %>' CssClass="projectNotesNoteTitleLabel" />
                            </div>

                            <asp:Button ID="btnMoveUp" runat="server" Text="&#x25B2;" ToolTip="Click to move up" CommandName="MoveItemUp" CommandArgument='<%# Eval("Note_Order") %>' CssClass="narrowButtons20" />
                            <asp:Button ID="btnMoveDown" runat="server" Text="&#x25BC;" ToolTip="Click to move down" CommandName="MoveItemDown" CommandArgument='<%# Eval("Note_Order") %>' CssClass="narrowButtons20" />
                            <asp:Button ID="btnEditNote" runat="server" Text="Edit" ToolTip="Click to edit this note" CommandArgument='<%# Eval("Note_ID") %>' onclick="btnEditNote_Click" CssClass="narrowButtons50" />
                        </div>

                        <div>
                            <asp:Label ID="Note_ContentLabel" runat="server" Text='<%# Eval("Note_Content") %>' CssClass="projectNotesNoteContentLabel" />
                        </div>

                    </div>

                </ItemTemplate>

            </asp:ListView>

        </div>

我想做的是在projectNotesTitleInfo div上创建一个onclick事件，这样它将切换Note\u ContentLabel标签的可见性。。。 我知道我可以在item databound事件中在服务器端执行此操作，事实上我之前已经执行了此操作，但不知何故，它似乎无法正常工作。。。也就是说，在IE中，div在切换后似乎会跳跃，而在chrome中，第一次使用切换时，div会展开，即使它已经展开了。在Chrome的源代码中，我添加到attributes.add（“onclick”，”）中的任何单引号（'）；bit显示为“我想知道这是否与此有关

我正在使用ASP.NET 4，所以我想使用clientMode=“Predictable”并将其链接到我的datakey字段，但我不知道如何将其传递到div的onclick事件。。。我试过像onclick=''这样的东西和它的变体，但它们都不起作用

---

正确的方法是什么？一般来说，在重复服务器控件中的项上使用动画的正确方法是什么？

实际上，在使用jquery时，您可能不需要从服务器端附加onclick—例如，在您的情况下，下面这样的脚本应该可以做到这一点：

$(document).ready(function() {
   // get all titles & attach click handler
   $('.projectNotesListOverall .projectNotesTitleInfo').click(function() {
       // find the related note & toggle it
       $(this).parent().parent().find('.projectNotesNoteContentLabel').toggle('slow');
   });
});

---

在你的页面上有这个脚本，它应该可以工作。若你们仍然觉得切换很紧张，那个么这个问题可能和你们的CSS类有关。

谢谢VinayC，这非常有效！很明显，我还有很多关于Javascript的知识需要学习：o）另外，你或其他人是否知道为什么在附加事件服务器端时，它会在第一次单击时扩展div，而不管它是否已经扩展？@user643192，从客户端还是服务器端附加onclick都不重要。但是在服务器端附加的问题是——使用引号可能会变得单调乏味，难以更改（如果在代码中需要重新编译），并且会增加标记大小。