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

__doPostBackを乗っ取る方向に私を向けてくれた@KenBrowningと@russauに感謝します。私はこれに対するいくつかの異なるアプローチを見てきました:

  1. 自分のバージョンの__doPostBackをハードコーディングし、後でページに配置して、標準バージョンを上書きするようにします。
  2. ページでRenderをオーバーロードし、既存の__doPostBackに独自のカスタムコードを挿入します。
  3. Javascriptの機能的な性質を利用して、__doPostBackに機能を追加するためのフックを作成します。

最初の2つは、いくつかの理由で望ましくないように思われるため(たとえば、将来、他の誰かが独自の機能を__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()成功しましたが、それは過剰に設計されていると思います。ASP.NET 2.0の時点で、最も簡単な回避策は次のとおりです。form.submit()$('form:first').submit(myHandler)

  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送信イベントを起動できるように、自分のものに置き換えます。

Iirc、これは、__doPostBackIE(おそらく他のブラウザーも)で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 に答える