Question

I don't know if this is the effects of an update panel或者什么，但我基本上有一个下拉列表，允许用户选择一个项目作为过滤器。选择项目后，它应该只将一个项目带回网格视图。也就是说，这个特定的过滤器最多会带回您正在寻找的记录。如果用户单击“应用”链接以应用筛选器，则此方法可以正常工作。 apply链接后面是一些服务器端代码（ASP.NET Web窗体应用程序中的C＃）。

我们收到了一位用户的请求，其中包含以下内容：

“如果我在此进行选择，为什么必须单击”应用“按钮一个下拉过滤器...它应该简单地得到我的一个记录寻找。这对我有帮助，因为我没有点击 “应用”按钮。“

我同意他并且想到最简单的方法是什么...我想：简单，我将有一个on down的变更事件处理程序，这样当做出选择时我会触发一次点击事件。有这样的效果：

        $("#MainContent_ddlCompany").on("change", function() {
            var companyId = $("#MainContent_ddlCompany").val();
            $("#MainContent_hdnCompanyValue").val(companyId);
            $("#<%=ddlCompany.ClientID %>").trigger("chosen:updated");

            if (companyId.length > 0) {
                $(".apply").click();
                $(".apply").removeClass("applyButton");
                $(".apply").addClass("resetButton");
            } else {
                //cleared selection of a company
                $(".apply").removeClass("resetButton");
                $(".apply").addClass("applyButton");
            }
        });

起初这不起作用，我不知道为什么，但经过一些严肃的谷歌搜索后，我改变了这一行：

$(".apply").click();

对此：

$('.apply')[0].click();

这很有效......所以我决定再试一次。当我一个接一个地选择一个过滤值时，我注意到页面开始变慢。事实上，到了第6或第7次，它几乎无法使用。我不知道为什么会发生这种情况，但我怀疑它是否与这个带有类名.apply的链接按钮位于更新面板内的事实有关。

但我仍然想到，在我更改jQuery代码以模拟click事件之前，它位于更新面板内部。那么为什么页面会因为这段代码而变慢并拖动？是从jQuery代码调用事件，在HTML中呈现可能导致此问题的其他内容吗？

如果我更改了我的代码并强制用户点击“应用”按钮，那么我们将恢复到正常速度。为什么我告诉jQuery模拟单击按钮我的页面减速？它正在做同样的事情，点击这个链接按钮的模拟是调用它的服务器端代码方法，无论用户是否点击它或我有jQuery点击它。

现在我不知道为什么会发生这种情况，因为这个按钮在任何一种情况下都在更新面板中，但是当我通过$('.apply')[0].click();点击它时，页面会在几次尝试后减慢速度。然而，当我让用户只需单击此按钮（没有jQuery点击事件），那么它可以正常工作吗？

我在这里缺少什么？

Answer 1

嗯，好吧，我发现了我的问题。因为我使用的是updatepanels，所以我必须将我的jQuery代码包装成add_endRequest。也就是说，你有一些效果：

$(document).ready(function() {

     //Some initial event/triggers

     var prm = Sys.WebForms.PageRequestManager.getInstance();
     prm.add_endRequest(function () {
         //Copy of some initial event/triggers
     });
});

为什么我要使用你问的endRequest？好吧，因为updatepanels基本上会在异步回发之后丢弃所有事件，因为此时（再次更新之后）的HTML再次呈现，并且此时与更新面板内的任何控件相关联的所有事件都将被删除。此时document.ready()无法运行，因此我必须重新订阅endRequest内的这些事件。输入我的问题......

我有一个巨大的脑屁，我基本上拿走了所有东西，字面上文件中的所有内容都准备就绪并将其复制到endRequest。事实上，如果我没记错的话，我会读到陈述的文章

无论您在文档准备中拥有什么，只需将粘贴复制到endRequest
即可

那没关系，但你必须要小心。我把更新面板内没有包含的事件扔进了endRequest。结果是灾难性的......至少对我而言。

这些事件将被多次附加..或者基于异步回发的数量。在我的情况下，正如我在第6或第7次性能开始降级后提到的测试。好吧，到那时我的控件多次附加到事件上。例如，我的.apply按钮和我的dropdownlist都在updatepanel之外。但我的jQuery代码在dropdownlist和document ready附加了endRequest的更改事件。

结果最初非常快，因为它只在document ready。但是当我进行异步回发时，每次都会附加这些事件。对于n个测试，我会有n个附加事件...在我的情况下，7的测试在变更事件处理程序上产生7个！

例如，不要为任何不在更新面板中的控件放置任何事件处理程序，如jQuery的on()事件。否则你会遇到我遇到的事情，因为事件发生时性能很差。

为什么告诉jQuery点击我的链接按钮减慢我的页面？

1 个答案: