0

jquery マスター向けの 1 つを次に示します。

これは機能します：

$(function (){
    $("#<?= $gridArr['event_id'] ?> .gallery-add").each(function() {
        var $dialog = $("<div></div>");
        var $link = $(this).one("click", function() {
            $dialog
                .load($link.attr("href"))
                .dialog({
                    modal: true,
                    width: 520,
                    height: 180,
                    title: $link.attr("title")
                });
            $link.click(function() {
                $dialog.dialog("open");                                    
                return false;
            });        
            alert('clicked');           
            $(document).bind('uploadDone', function(e) {
               // alert("dialogCloser triggered in dialog function");
                $dialog.dialog("close"); 
                $("#<?= $gridArr['uniq'] ?>-event-path-form-submit").trigger('click');   
            });                         
            return false; 
        });

    });
});

これはしません:

$(function (){
    $("#<?= $gridArr['event_id'] ?> .gallery-add").each(function() {
        var $dialog = $("<div></div>");
        var $link = $(this).one("click", function() {
            $dialog
                .load($link.attr("href"))
                .dialog({
                    modal: true,
                    width: 520,
                    height: 180,
                    title: $link.attr("title")
                });
            $link.click(function() {
                $dialog.dialog("open");                                    
                return false;
            });        
            // alert('clicked');           
            $(document).bind('uploadDone', function(e) {
               // alert("dialogCloser triggered in dialog function");
                $dialog.dialog("close"); 
                $("#<?= $gridArr['uniq'] ?>-event-path-form-submit").trigger('click');   
            });                         
            return false; 
        });

    });
});

唯一の違いは、アラート ステートメントです。基本的に私がここで行っているのは、一連のクリック イベント ハンドラーを画像にアタッチすることです。これにより、ダイアログに ajax アップロード フォームが表示されます。アップロード フォームは、画像を iframe にダンプします。その後、iframe は $(document) にバインドされた uploadDone ハンドラーをトリガーし、別のクリック イベントをトリガーします。

唯一の違いは、アラート ステートメントの存在です。その行を取り出すと、ダイアログが閉じません。

セミコロンかばかげたことを見逃しただけだと教えてください.... そうでなければ、delay() を使用することを考えていました。

ありがとう。

解決：

私は最終的にこれにたどり着きました。アラートステートメントで何が起こっているのか、または非同期実行を管理する方法を明確に判断することはできませんでしたが、これでうまくいきました。

var $dialog = $("<div></div>");
$(function (){    
    $("#event_22 .gallery-add").each(function() {
        var $link = $(this).one("click", function() {
            $dialog
                .load($link.attr("href"))
                .dialog({
                    modal: true,
                    width: 520,
                    height: 180,
                    title: $link.attr("title")
                }).bind('uploadDone', function() {
                 // alert("uploadDone triggered in dialog function");
                 $("#myForm-submit").trigger('click');
            });
            $link.click(function() {
                $dialog.dialog("open");                                    
                return false;
            });
            return false; 
        });       
    });
});

成功iframeでは、

parent.$dialog.dialog("close");
parent.$dialog.trigger( 'uploadDone' );

助けてくれてありがとう。これを機能させるために行った変更は次のとおりです。

  • グローバル スコープの関数外で宣言された $dialog
  • $link.click() を作成する前に、uploadDone イベント リスナーを $dialog にバインドしました。
  • id="22" を id="event_22" に変更しました。html < 5 では、ID は英字で始まる必要があります。

誰が受け入れるかはわかりませんが、皆様のご協力に感謝いたします。

4

2 に答える 2

5

ほとんどの場合、アラート ステートメントは、下のコードが実行される前に、その上にあるコードが完了する時間を与えるブロックを引き起こしている可能性があります。私の推測では、アラートがないと、アップロードが完了する前に false が返されます。

于 2012-09-24T21:17:03.953 に答える
1

私の推測では、uploadDone イベントがバインドされる前にダイアログが読み込まれていると思います。作成時ではなく、クリックイベントハンドラー内でバインドする理由はありますか?

$(function (){
  $("#<?= $gridArr['event_id'] ?> .gallery-add").each(function() {
    var $dialog = $("<div></div>");
    var $link = $(this).one("click", function() {
        $dialog
            .load($link.attr("href"))
            .dialog({
                modal: true,
                width: 520,
                height: 180,
                title: $link.attr("title")
            });
        $link.click(function() {
            $dialog.dialog("open");                                    
            return false;
        });           
        return false; 
    });
    $(document).bind('uploadDone', function(e) {
        // alert("dialogCloser triggered in dialog function");
        $dialog.dialog("close"); 
        $("#<?= $gridArr['uniq'] ?>-event-path-form-submit").trigger('click');   
    }); 

  });
});

uploadDone がブロードキャストされるたびに常にすべてのダイアログを閉じたい場合、これは機能するはずです。しかし、あなたの質問のコメントでデビッドが言っているように...いくつかの文脈が役に立ちます

于 2012-09-24T21:22:15.167 に答える