除了服务器端回调之外，我如何调用javascript函数?

How do I call a javascript function in addition to a server-side callback?

本文关键字：调用 javascript 函数 何调用 回调 服务器端      更新时间：2023-09-26

我有一些像这样的标记:

<form id="ddlSelections" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
    <asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="DDL3" EventName="SelectedIndexChanged" />
        </Triggers>
        <ContentTemplate>
            <asp:DropDownList ID="DDL3" OnSelectedIndexChanged="testFunc" runat="server" />
        </ContentTemplate>
    </asp:UpdatePanel>
</form>
<div id="placeholder"></div>

当下拉列表DDL3发生变化时，回调testFunc。我想在此下拉框中添加一个额外的事件处理程序，以更新placeholderdiv。为此，我试图使用jQuery。我在head标签中尝试了这个:

$(function () {
       $("#DDL3").click(function () {
           alert("Clicked" + $("#DDL3").val());
       });
});

但是jQuery没有捕捉到这些事件。我猜这是因为ASP可能覆盖了事件处理程序。

有办法做到这一点吗?

编辑:呈现的内容:

<select id="DDL3" onchange="javascript:setTimeout('__doPostBack(''DDL3'','''')', 0)" name="DDL3">

既然是ASP。. NET控件，您需要通过ClientID:

引用它。下面是测试用例: 
<asp:UpdatePanel ID="pnl" runat="server">
    <ContentTemplate>
        <asp:DropDownList ID="DDL3" runat="server">
            <asp:ListItem Text="Test" Value="1"></asp:ListItem>
            <asp:ListItem Text="Test 2" Value="2"></asp:ListItem>
        </asp:DropDownList>                    
    </ContentTemplate>                
</asp:UpdatePanel>                
<div id="placeholder">I'm here</div>

有两种方法来处理选择的改变:

$(function() {
    $("#<%=DDL3.ClientID%>").change(function(e) {
        $("#placeholder").html("Hello world!");
    });
});

如果你愿意，也可以使用这种方法:

$(function() {
    $("#<%=DDL3.ClientID%> option").click(function() {
        $("#placeholder").html("Hello world!");
    });
});

如果以上两种方法都不起作用，可以在这里找到另一种解决方法。

你的"问题"是<asp:UpdatePanel>。UpdatePanels在更新时重写它们的内容，所以你绑定到的<select>可能不是你正在交互的<select>——即使它们看起来一样。

您可以监听Microsoft Ajax的事件——endRequest或pageLoaded——之后您可以像以前一样绑定:

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function () {
    $('#<%= DDL3.ClientID %>').click(function () {
        alert("Clicked " + $(this).val();
    });
});

或者使用jQuery的.live或.delegate:

$('#<%= DDL3.ClientID %>').live('click', function () {
    alert("Clicked " + $(this).val());
});
相关文章：