使用jQuery事件绑定

Question

奇怪的行为，这是一个jQuery的主人：

这工作：

$(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'); 

非常感谢大家的帮助。下面是我做得到这个工作的变化：

功能外
• 宣布$对话框在全球范围内
• 约束uploadDone事件监听器创建$ $ link.click（）
• 之前对话框在html中更改id =“22”为id =“event_22”原因< 5，ID必须以alpha字符开头。

我不确定谁的回答接受，但我当然非常感谢您的帮助。

Answer 1

警告声明很可能会导致一个代码块，它会在下面的代码执行之前给它上面的代码完成时间。我的猜测是，如果没有提醒，它会在上传完成之前一直返回false。

Answer 2

我的猜测是，在uploadDone事件被绑定之前，对话框正在加载。是否有理由将其绑定到click事件处理程序中，而不是在创建它时？

$(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广播。但是，就像大卫在你的问题的评论中所说的那样......一些上下文将会有所帮助