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

Question

我有一些这样的标记:

<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 的回调。我想向这个下拉框添加一个额外的事件处理程序，它将更新 placeholder div。为此，我尝试使用 jQuery。我在 head 标签中试过这个:

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

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

有什么办法可以实现吗？

编辑:呈现的内容:

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

Answer 1

因为它是一个 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!");
    });
});

如果以上都行不通，可以另寻解决方案here .