1

ajax送信について質問があります。

私はhtmlフォームを持っています

<div style="display:none">
    <form id="myform" method="post" action="">
        <input type="text" id="name" />
        <input type="submit" id="sbmt" />
    </form>
</div>

ファンシーボックスを開くボタン：

<a id="sbtfancybox" href="#myform">
    <input type="button" value="Add new" 
           onClick="defineFancybox();" />
</a>

そして、jquery で fancybox を定義します。

<script type="text/javascript">
    function defineFancybox() {
        $('#sbtfancybox').fancybox({
            //...some json parameters
        });

        $('#myform').submit(function() {//the main problem is here
             //....calling an ajax
             return false;
        });
    }
</script>

私の質問は$('#myform').submit(..)、サブミットが常に 1 回呼び出されるようにする方法です。最初に fancybox を開いた場合は 1 回$('#myform').submit()呼び出され、fancybox を 2 回目に開いた$('#myform').submit()場合は 2 回呼び出され、fancybox を開いた場合は 2 回呼び出されます。 3回目$('#myform').submit()はツリータイムなどと呼ばれます。

ありがとうございました

4

4 に答える 4

2

jQuery イベント ハンドラーは、同じ関数を再度バインドしている場合でも、互いにオーバーライドしません。このコードを呼び出すたびに:

$('#myform').submit(function() {//the main problem is here
    //....calling an ajax
    return false;
});

別のイベント ハンドラが追加されます。そのコードは、ボタンをクリックしたときに呼び出される関数内にあるため、最初のクリックで 1 つのイベント ハンドラーが生成されます。2 回目のクリックでもう 1 つ追加され、2 つになりました。3 回目のクリックでもう 1 つ追加されるため、3 つ...

フォームは動的に作成されていないように見えるため、ページの読み込み時に単一のイベント ハンドラーをバインドできます。

$(document).ready(function() {
    $('#myform').submit(function() {
        //....calling an ajax
        return false;
    });
});

次に、defineFancybox()関数の外に移動します。

イベント ハンドラーをその関数内にバインドしておく必要がある場合は、関数(または.off()1.7.unbind()より前のバージョンを使用している場合) を使用して、新しいイベント ハンドラーをバインドする前に既存のイベント ハンドラーを削除できます。

$('#myform').off('submit').submit(function() {
    //....calling an ajax
    return false;
});
于 2013-01-04T10:12:52.720 に答える
1

.one()ハンドラで試しましたか:

$('#myform').one('submit', function() {//This will make it submitted once
    //....calling an ajax
    return false;
});
于 2013-01-04T10:13:37.493 に答える
0

次のようなことができます

    $('#myform').unbind('submit');
    $('#myform').bind('submit',function() {//the main problem is here
         //....calling an ajax
         return false;
    });
于 2013-01-04T10:30:29.667 に答える
0

以下を試すことができます

$("#myform").each(function(i) {
    var handler = i.on("submit", function() {
        handler.stop();
        // do stuff
    });
    // other stuff
});
于 2013-01-04T19:19:56.127 に答える