jquery - 为什么我的 PostBack 发生在 jQuery 单击事件之前？

Question

我对 jQuery 相当陌生，但我的页面上有一些链接，这些链接应该在单击时切换可见的表单部分，或者如果禁用 javascript，它会执行完整的回发来切换这些部分

它在我的测试环境中工作正常，回发发生在 jQuery 脚本之后，但是一旦我部署它，回发就会发生在 jQuery 单击事件之前。它部署在运行IIS 6.0的Windows 2003服务器上，而我的测试环境是Windows XP/IIS 5.1/VS2010

这是我正在使用的代码。如果我将脚本放在 .ready() 而不是 .click() 中，则脚本会在生产中运行，但在 .click() 中我不这样做甚至没有收到警报，所以我假设问题是在 jQuery 脚本有机会执行之前发生的 PostBack。

jQuery:

$(document).ready(function () {
    // Toggle Details
    $('.toggleDetailsButton').click(function () {
        alert('test');
        $(this).parentsUntil(".parentRow").parent().next().toggleClass("hidden");
        return false;
    });
});

隐藏代码:

Protected Sub rpData_ItemCommand(ByVal sender As Object, ByVal e As RepeaterCommandEventArgs) Handles rpData.ItemCommand
    // Manually toggle rows here
End Sub

ASP:

<asp:Repeater ID="rpData" runat="server">
    <ItemTemplate>
        <tr class="parentRow">
            ...
                <asp:Button runat="server" ID="cmdViewDetails" 
                    CommandName="ToggleDetails" Text="details"
                    CssClass="buttonAsLink toggleDetailsButton" />
            ...
        </tr>
        <tr id="rpData_DetailsRow" class="detailsRow hidden" runat="server">

        </tr>
    </ItemTemplate>
</asp:Repeater>

编辑

根据下面评论中的建议，在 onClientClick 中运行 jQuery 函数使页面按其应有的方式运行，但是我仍然想知道为什么在我的测试环境中的 jQuery 事件之后发生 PostBack ，但在生产中的 jQuery 事件之前。

我还注意到两者之间的其他差异。例如，我还有一个用于打开/关闭搜索 div 的按钮，该按钮在测试中运行良好，但在生产中则不然。它使用 $('.toggleSearchButton').next() 获取搜索按钮下的 div 并切换其类名。在生产环境中，该对象返回[object Object]，但是调用.attr('class')返回undefined(. attr('id')、.attr('tag') 和 .nodeName)。在我的测试环境中，它返回我的搜索 div 的正确值。

我已经在 IE、FF 和 Chrome 中测试了此行为。在我的测试机器上，它在所有 3 台机器上都能正常工作。在我的生产机器上，只有 IE 能够正常工作。

Answer 1

试试这个:

$('.toggleDetailsButton').click(function (e) {
   if (e.stopPropagation) e.stopPropagation();
   if (e.preventDefault) e.preventDefault();

   .
   .
});

默认情况下按钮呈现一个提交按钮。您还可以设置 UseSubmitBehavior="false"使其成为 <input type="button" />元素，看看这是否会给您带来更好的结果。