Question

我正在使用asp.net更新面板。在这个更新面板中，我有3个下拉列表＆amp;一个“提交”按钮。使用javascript，我将“click”事件绑定到提交按钮，以便捕获3个下拉列表的值，但是，如果我从下拉列表中选择一个新值，我会执行autopostback来更改其他下拉列表的值。这样做会强制我的页面丢失我的javascript点击事件。如果我删除updatepanel，一切正常。知道我怎么能这样做吗？这是我的代码（我对global.js文件的引用必须位于页面底部）：

ASPX：

<asp:UpdatePanel ID="updatepanelddlist" runat="server">
            <ContentTemplate>

              <asp:DropDownList ID="ddlCategory" runat="server" AutoPostBack="true" DataTextField="Description"
                      DataValueField="id" OnSelectedIndexChanged="ddlCategory_SelectedIndexChanged" CssClass="txt sc_dropdown">
                    </asp:DropDownList>
                  <br/>
                    <asp:DropDownList ID="ddlProduct" runat="server" CssClass="txt sc_dropdown" DataTextField="Description"
                      DataValueField="id" AutoPostBack="true" OnSelectedIndexChanged="ddlProduct_SelectedIndexChanged">
                    </asp:DropDownList>
                 <br/>
                    <asp:DropDownList ID="ddlFormat" runat="server" CssClass="txt sc_dropdown" DataTextField="Description"
                      DataValueField="id" AutoPostBack="true" OnSelectedIndexChanged="ddlFormat_SelectedIndexChanged">
                    </asp:DropDownList>
                 <br />                     
                    <asp:LinkButton ID="btnSearch" runat="server" Text="search" 
                      OnClick="btnSearch_Click" Style="float: right;"  />                       
            </ContentTemplate>
          </asp:UpdatePanel>
<script type="text/javascript" src='<%=ResolveUrl("~/Scripts/Tracking/global.js") %>'></script>

这是我的global.js文件：

$(document).ready(function() {
setTracking();
});

function setTracking() {
 //add a click event
    $(this).bind('click', function(e) {
    //do some stuff here
    });
 });

如何在更新面板回发中保留我的javascript点击事件？

由于

Answer 1

您的代码中似乎缺少某些内容。你说你绑定了提交按钮，但$（this）不在该按钮的上下文中。

无论如何，只有在提交后才会重新呈现updatePanel中的控件。这在技术上是页面上的一个新控件，这就是click事件不再受限的原因。

尝试这个，而不是直接绑定，使用该按钮的选择器绑定文档：

$(document).on("click", "[id$=btnSearch]", function () { ... });

了解有关.on的更多信息： http://api.jquery.com/on/

在updatepanel中丢失javascript click事件

1 个答案: