如何在 ASP.NET 应用程序中使用 jQuery 捕获提交事件? [英] How to capture submit event using jQuery in an ASP.NET application?

查看：25
本文介绍了如何在 ASP.NET 应用程序中使用 jQuery 捕获提交事件?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

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

 $("form").bind("submit", function() {alert("您正在提交！");});

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

有没有办法让这个工作?我可以附加到触发提交的单个元素的事件，但这不太理想 - 有太多的可能性(例如带有 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="服务器"><title></title><身体><form id="form1" runat="server"><div><asp:scriptmanager id="ScriptManager" runat="server" enablepartialrendering="true"><脚本><asp:scriptreference path="/Standard/Core/Javascript/Jquery.min.js"/></脚本></asp:scriptmanager><p><asp:linkbutton id="TestButton" text="点击我！"runat="服务器"/></p>

</表单><script type="text/javascript">$(document).ready(function() {alert("文件准备好了.");$("form").submit(function() {alert("检测到提交.");});});

单击链接按钮时，我收到文档就绪"警报，但没有收到检测到提交".

解决方案

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

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

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

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

addToPostBack = function(func) {var old__doPostBack = __doPostBack;if (typeof __doPostBack != 'function') {__doPostBack = 函数；} 别的 {__doPostBack = 函数(t，a){if (func(t, a)) old__doPostBack(t, a);}}};$(document).ready(function() {alert("文件准备好了.");addToPostBack(function(t,a) {返回确认(真的吗?")});});

更改了 addToPostBack 以便

  1. 它可以采用与 __doPostBack 相同的参数
  2. 被添加的函数发生在 __doPostBack 之前
  3. 被添加的函数可以返回 false 以中止回发

I'm trying to handle the submit event of a form element using jQuery. 

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

This never fires when the form submits (as part of a postback, e.g. when I click on a button or linkbutton).

Is there a way to make this work? I could attach to events of the individual elements that trigger the submission, but that's less than ideal - there are just too many possibilities (e.g. dropdownlists with autopostback=true, keyboard shortcuts, etc.)

Update: Here's a minimal test case - this is the entire contents of my aspx page:

<%@ 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>

I get the "Document ready" alert, but not the "Submit detected" when clicking on the linkbutton.

解决方案

Thanks, @Ken Browning and @russau for pointing me in the direction of hijacking __doPostBack. I've seen a couple of different approaches to this:

  1. Hard-code my own version of __doPostBack, and put it later on the page so that it overwrites the standard one.
  2. Overload Render on the page and inject my own custom code into the existing __doPostBack.
  3. Take advantage of Javascript's functional nature and create a hook for adding functionality to __doPostBack.

The first two seem undesirable for a couple of reasons (for example, suppose in the future someone else needs to add their own functionality to __doPostBack) so I've gone with #3.

This addToPostBack function is a variation of a common pre-jQuery technique I used to use to add functions to window.onload, and it works well:

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?")
    });
});

Edit: Changed addToPostBack so that

  1. it can take the same arguments as __doPostBack
  2. the function being added takes place before __doPostBack
  3. the function being added can return false to abort postback

这篇关于如何在 ASP.NET 应用程序中使用 jQuery 捕获提交事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
C#/.NET最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆