表单提交事件未捕获 OnSelectedIndexChanged？答案

【问题标题】：Form submit event is not capturing OnSelectedIndexChanged?表单提交事件未捕获 OnSelectedIndexChanged？
【发布时间】：2013-08-29 01:38:28
【问题描述】：

我有一个button 和一个dropdownlst

我有这个脚本：

$("form").submit(function (e)
    {
        $('#divOverlay').show();
        });

我的目标：

当表单提交时，我需要显示“正在加载div”：

问题：

当我按下按钮时，它确实向我显示 div（闪烁一秒钟的灰色 div）：

但是当我更改下拉列表中的索引时：

<asp:DropDownList runat="server" OnSelectedIndexChanged="OnSelectedIndexChanged" AutoPostBack="True">
    <asp:ListItem Value="a"> a</asp:ListItem>
        <asp:ListItem Value="b">b</asp:ListItem>
</asp:DropDownList>

它确实提交但我不看到 div：

为什么$("form").submit(function (e) 没有捕获在选定索引更改后发生的回发？ ?

注意：

Fiddler 将两个事件（按下按钮 && 更改索引）显示为 POST 命令

文件的结构是什么？（伪）：

<html  >
<head>
 ...     
</head>
<body>
    <div id='divOverlay'>  
       ...
    </div>

        <form id="form1" runat="server"  >
            <asp:Button runat="server" Text="sssssss"/>
        <asp:DropDownList runat="server" OnSelectedIndexChanged="OnSelectedIndexChanged" AutoPostBack="True">
            ...
        </asp:DropDownList>

        </form>


        <script type="text/javascript">
            $(function()
                {
                    $("form").submit(function (e)
                    {
                            $('#divOverlay').show();
                    });
                });

        </script>
</body>
</html>

你能显示发送到服务器的两个请求之间的区别吗？ **Yes.**

右侧是更改索引时，左侧窗格用于按钮按下

【问题讨论】：

也许这会有所帮助：stackoverflow.com/questions/2073384/…
@Johan 尝试了 document.ready 和没有 - 它仍然不起作用
这似乎是相关的：stackoverflow.com/questions/1230573/… 也许有帮助？

标签： javascript jquery html asp.net forms

【解决方案1】：

我猜自动回发的行为是通过javascript提交表单并调用__doPostBack()，这不会触发提交事件。

你可以试试：

<asp:DropDownList onchange="$('#divOverlay').show();" runat="server" OnSelectedIndexChanged="OnSelectedIndexChanged" AutoPostBack="True">

【讨论】：

submit 是表单对象的 javascript 方法。它也是用户提交表单时触发的事件。但是通过代码提交表单时不会触发。见stackoverflow.com/q/645555/1236044

【解决方案2】：

不确定，听起来像是 DDL 的回发和形式 r 的不同。

无论如何，我建议您通过从 DDL 中删除自动回发并添加一个客户端 onchange 来解决，您可以在其中显示灰色 div，然后手动回发服务器端 onselect，如下所示： http://bresleveloper.blogspot.co.il/2012/05/force-updatepanel-postback.html 或者只是 $("form").submit()

【讨论】：

整个目的是添加一个脚本，该脚本将显示 给定站点 的 div，这意味着 - 不要触摸 html 并使用纯 JS 解决它。并且您的解决方案需要更改每个页面的功能/代码
我想我在这里遗漏了一些东西 Royi，无论如何你都在做这个 $("form").submit(function (e) { $('#divOverlay').show(); });,为什么你不能只添加一些行？对不起m8的无知
这是在单独的 JS 文件（js 文件）.p.s 上完成的。我已经找到了解决方案。明天生病更新。

【解决方案3】：

不确定这是否会有所帮助，但这对我有用。我可以在两个事件中显示覆盖 div。

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
    <script type="text/javascript">
        $(document).ready(function () {
            $("form").submit(function (e) { 
                alert("Submit");
            });
            $("#dropdown").change(function (e) {
                alert("Hi");
            });
        });

    </script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:Button runat="server" ID="submitbutton" Text="submit"/>
    <asp:DropDownList ID="dropdown" ClientIDMode="Static"  runat="server" AutoPostBack="True"  OnSelectedIndexChanged="OnSelectedIndexChange"/>
</asp:Content>

【讨论】：

【解决方案4】：

有一个 ASP.NET 的方法：ClientScript.RegisterOnSubmitStatement，可让您在每次提交 HtmlForm 时运行 JavaScript 语句

ClientScript.RegisterOnSubmitStatement(this.GetType(), "divOverlayShow", "$('#divOverlay').show();");

【讨论】：

这是有效的。谢谢！我会调查它背后生成的JS。
奇怪，但 $("form").attr('onsubmit', 'alert(1);'); 确实有效。虽然附加 JS 事件处理程序不起作用....