3

以下の例で、送信ボタンの最も近いフォームをトリガーできないのはなぜですか?

html、

<form name="input" action="html_form_action.asp" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

jquery、

$('input[type=submit]').click(function(){

    $(this).closest('form').unbind('submit').submit(function(){
           alert("hello world");
        return false;
    });
    return false;
});

警告メッセージを受け取る必要がありますが、できません。私は何を間違えましたか？

jsfiddle _

4

2 に答える 2

3

うわー、それはたくさんのバブリングイベントです...

false を返し続け、イベントをバインドして入札を解除します...それは機能しませんが、submitボタンを通常のに簡単に変更できますbutton。次に例を示します。

<form name="input" action="html_form_action.asp" method="get">
    Username: <input type="text" name="user" />
    <input type="button" value="Submit" class="btn-submit" />
</form>

そして書く

$(".btn-submit").click(function() {
    $(this).prop("disabled", true); // dont allow more clicks 
    alert('about to submit...');
    $(this).closest("form").submit();
    alert('done!');
});

JsBin のデモ: http://jsbin.com/elokov/1/

フォームを送信するための ajax 呼び出し

$(".btn-submit").click(function(evt) {
    $(this).prop("disabled", true); // dont allow more clicks 
    alert('about to submit...');

    var frm = $(this).closest("form"); // our form

    $.ajax(
        type: frm.attr("method"),
        url:  frm.attr("action"),
        data: frm.serialize(),
        success: function(data) {
            alert('all went well');
        },
        success: function(jqXHR, textStatus) {
            alert('err, something messed up! ' + textStatus);
        }
    );

    return false; // or use evt.preventDefault();
});
于 2013-07-13T19:20:23.430 に答える
0

コードは単に送信イベントをバインドしているためですが、送信イベントをトリガーしていません。フォームの送信と変更を防止したいだけの場合は、これで十分です

$('input[type=submit]').click(function (e) {
    alert("hello world");
    return false;
});
于 2013-07-13T19:19:23.860 に答える