34

我正在尝试使用 jQuery 处理元素的submit事件。form

    $("form").bind("submit", function() {
        alert("You are submitting!");
    });

这在表单提交时永远不会触发(作为回发的一部分,例如当我单击按钮或链接按钮时)。

有没有办法使这项工作?我可以附加到触发提交的单个元素的事件,但这不太理想 - 有太多的可能性(例如带有 autopostback=true 的下拉列表、键盘快捷键等)


更新:这是一个最小的测试用例 - 这是我的 aspx 页面的全部内容:

<%@ page language="vb" autoeventwireup="false" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:scriptmanager id="ScriptManager" runat="server" enablepartialrendering="true">
                <scripts>
                    <asp:scriptreference path="/Standard/Core/Javascript/Jquery.min.js" />
                </scripts>
            </asp:scriptmanager>
            <p>
                <asp:linkbutton id="TestButton" text="Click me!" runat="server" /></p>
        </div>
    </form>

    <script type="text/javascript">
        $(document).ready(function() {
            alert("Document ready.");
            $("form").submit(function() {
                alert("Submit detected.");
            });
        });
    </script>

</body>
</html>

单击链接按钮时,我收到“文档准备就绪”警报,但没有“检测到提交”。

4

8 回答 8

39

感谢@Ken Browning 和@russau 为我指明了劫持__doPostBack 的方向。我已经看到了几种不同的方法:

  1. 对我自己的 __doPostBack 版本进行硬编码,然后将其放在页面上,以便覆盖标准版本。
  2. 在页面上重载 Render 并将我自己的自定义代码注入现有的 __doPostBack。
  3. 利用 Javascript 的功能特性并创建一个钩子以向 __doPostBack 添加功能。

由于几个原因,前两个似乎不受欢迎(例如,假设将来其他人需要将自己的功能添加到 __doPostBack)所以我选择了#3。

这个addToPostBack函数是我用来添加函数的常见 pre-jQuery 技术的变体,window.onload,它运行良好:

addToPostBack = function(func) {
    var old__doPostBack = __doPostBack;
    if (typeof __doPostBack != 'function') {
        __doPostBack = func;
    } else {
        __doPostBack = function(t, a) {
            if (func(t, a)) old__doPostBack(t, a);
        }
    }
};

$(document).ready(function() {
    alert("Document ready.");
    addToPostBack(function(t,a) {
        return confirm("Really?")
    });
});

编辑:更改 addToPostBack 以便

  1. 它可以采用与 __doPostBack 相同的参数
  2. 添加的函数发生在 __doPostBack 之前
  3. 添加的函数可以返回 false 以中止回发
于 2009-08-05T18:12:48.000 回答
15

我已经通过覆盖的解决方案__doPostBack()取得了成功,以便在form.submit()(ie $('form:first').submit(myHandler)) 上调用覆盖,但我认为它被过度设计了。从 ASP.NET 2.0 开始,最简单的解决方法是:

  1. 定义提交表单时要运行的 javascript 函数,即

    <script type="text/javascript">
    
    function myhandler()
    {
        alert('you submitted!');
    }
    
    </script>
    
  2. 在您的代码隐藏中注册您的处理程序函数,即

    protected override void OnLoad(EventArgs e)
    {
        base.OnLoad(e);
        ScriptManager.RegisterOnSubmitStatement(Page, Page.GetType(), 
                                                "myHandlerKey", "myhandler()");
    }
    

就这样!myhandler()将从简单的按钮输入提交和自动__doPostBack()调用中调用。

于 2009-09-21T14:08:34.310 回答
4

是的,这很烦人。我__doPostBack用我自己的替换,这样我就可以提交事件来触发。

__doPostBackIirc,这是在 IE(可能还有其他浏览器)中通过 javascript(调用 do)提交表单时出现的问题。

复制默认行为后我的__doPostBack替换调用$(theForm).submit()(在隐藏输入中填充值)

于 2009-08-05T00:23:15.290 回答
1

我不知道如何使用 jQuery,但您可以将 OnClientClick 属性添加到 ASP.NET 控件:

<asp:linkbutton id="TestButton" text="Click me!" runat="server" OnClientClick="alert('Submit detected.');" />
于 2009-08-05T14:31:00.903 回答
1

如果您使用的是 .NET Framework 3.5 或更高版本,则可以在服务器端代码中使用ScriptManager.RegisterOnSubmitStatement() 。注册的脚本将在正常提交和 DoPostback 上被调用。

ScriptManager.RegisterOnSubmitStatement(this, this.GetType(), "myKey", "SomeClientSideFunction();");
于 2013-02-14T19:31:11.093 回答
0

这适用于捕获提交:

$("form input[type=submit]").live("click", function(ev) {
    ev.preventDefault();
    console.log("Form submittion triggered");
  });
于 2012-05-22T08:43:36.120 回答
0
 $(document).ready(function () {

          $(this).live("submit", function () {

                console.log("submitted");
             }
}
于 2012-12-10T22:40:12.667 回答
-2

您需要将 OnclientClick 添加到链接按钮

OnClientClick="if(!$('#form1').valid()) 返回 false;"

于 2011-12-07T05:16:14.780 回答