从AJAX（jQuery）加载模态窗口时的绑定元素

Question

我想在模态窗口中设置一个拖拽列表。窗口的内容是通过AJAX调用加载的，所以我相信我需要使用jQuery的.live（）方法。

这是我目前的代码：

$('#cboxLoadedContent').live('load', function() {
    // Event for sortable page lists
    $('ul#pageList').sortable();
});

如何在模态窗口加载时设置绑定？模态窗口来自colorbox插件。

注意：我猜测'load'不适合使用，因为如果我在那里抛出一个简单的alert()，它甚至都不会在窗口加载时出现。< / p>

Answer 1

在您的情况下，当您通过ajax加载元素时，只需在元素上调用.sortable()，如下所示：

$.ajax({
   url: 'page.html',
   //stuff...
   success: function(data) {
     //Put stuff in DOM
     $('ul#pageList').sortable();
   }
});

对于为什么部分：.live()不能以这种方式工作，它不会等待新元素并执行操作......它会侦听来自冒泡的元素的事件如果DOM有一个匹配的选择器，那么DOM就会执行事件处理程序。

Answer 2

这取决于您使用的模态窗口。

如果您使用jQuery UI dialog，则可以使用opendialog事件。

因此，您可以将函数绑定到对话框打开时触发的事件。

$( ".selector" ).bind( "dialogopen", function(event, ui) {
  ...
});

如果您没有使用jQuery UI，则必须转到代码并查看弹出窗口打开时是否触发某些事件。