jquery ui对话 – 现场不工作？
我正在使用此对话框： http ： //docs.jquery.com/UI/Dialog
要打开对话框，我这样做：
$('a.openModal').live("click", function() { var idArr = $(this).attr('id').split("OpenNote"); var id = idArr[1]; alert($(".modalNote#dialog-modal" + id).html()); $(".modalNote#dialog-modal" + id).dialog('open'); return false; }); 此对话框用于在单击标题时显示注释的内容。 当我在pageload上生成html时，这样可以正常工作，但是如果我动态添加html，那么对话框将无法打开。 它附加到div时也不会被隐藏。
是否可以“在飞行中”打开它？
编辑1：
我试过这个，但还是没有……
$(document).delegate('a.openModal', 'click', function() { var idArr = $(this).attr('id').split("OpenNote"); var id = idArr[1]; alert($(".modalNote#dialog-modal" + id).html()); $(".modalNote#dialog-modal" + id).dialog('open'); return false; });
编辑2：
这是完整的简化示例：
HTML：
Content... Add new
JS：
//Global Script for Calling a Fourth Modal with a class of "modal4" $(".modalNote2").dialog({ autoOpen: false, width: 500, height: 375, position: ['center', 'center'], modal: true }); $("#mlist").append("fghfghfghfghfghsdf"); $(document).delegate('a.openModal2', 'click', function() { $(".modalNote2").dialog('open'); return false; });
当我点击链接时，会添加新的模态div，当前的一个被打开但新的一个没有，并且正在显示。
编辑3
我遵循这些指示，如果我这样做，事情就会大大简化： http ： //blog.nemikor.com/2009/08/07/creating-dialogs-on-demand/
var $loading = $('
'); $('.openModal').each(function() { var $dialog = $('') .append($loading.clone()); var $link = $(this).one('click', function() { $dialog .load($link.attr('href')) .dialog({ title: $link.attr('title'), width: 500, height: 300 }); $link.click(function() { $dialog.dialog('open'); return false; }); return false; }); });
但是ajax生成链接的问题仍然存在。
编辑4 – 解决了！
最后，我找到了解决方案！
var $loading = $(''); $(document).delegate(".openModal", "click", function() { var $link = $(this); var $dialog = $('') .append($loading.clone()) .load($link.attr('href')) .dialog({ autoOpen: false, title: $link.attr('title'), width: 500, height: 300 }); $dialog.dialog('open'); return false; });
发生这种情况是因为您将事件绑定到当前页面上的对象，因此在您注入新HTML之后，这些事件将不会绑定到它。 如果您正在使用jQuery 1.4，那么您可以使用.delegate（）方法解决此问题，如下所示：
$(document).delegate('a.openModal', 'click', function(){ // your .live code here });
这会将事件绑定到始终存在的文档，以搜索选择器的实例。 出于性能原因，您应该将$（document）替换为最接近的静态父级将始终包含您的选择器。
如果你使用的是早期版本的jQuery，你应该查看livequery插件。 我提供了一个链接，但我正在通过手机从机场接听。 🙂