$(this).dialog 不是函数

Question

...或者为什么 $(this).dialog() 在使用动态 HTML 时在 Firefox 中会失败？

我有一个点击事件，它在网页上打开一个 jQuery 模式对话框，它在 Chrome 和 IE 中运行良好，但在 Firefox 中却不行。

下面是相关代码：

var dialogId = 'uniqueName-' + Math.floor(Math.random() * 1000)
var dialogDiv = $(document.createElement('div')).attr("id", dialogId);

dialogDiv.load(this.href, function () {
    var dialog = $(this).dialog({ autoOpen: false });
    ...
});

在 Firefox 11 中，$(this).dialog({ autoOpen: false }) 失败并显示以下错误消息：

$(this).dialog 不是函数

但在 IE 9 和 Chrome 17 中一切正常。有什么线索吗？

更新：

这是上面代码所在的document.ready 函数。我删除了它以简化事情。 ALERT A 发生在 ALERT B 之前。ALERT A 显示[object Object]。当我点击链接并显示'undefined' 时，会出现警报 B。

$(function () {

    alert($.ui);    // ALERT A

    // Wire up the click event of any dialog links
    $('.dialogLink').live('click', function () {
        alert($.ui);    // ALERT B
        return false;
    });
});

更新 2：

既然我指出了问题的出处，我重新表述了我的问题，并在此处发布了重现原始问题的最少代码：Why is FF on OS X losing jQuery-UI in click event handler?

Answer 1

问题出在 Firefox 附加组件上。我在安全模式下启动了 Firefox，现在一切正常。我试图确定是哪个加载项导致了问题，并在打开或关闭各种加载项的情况下重新启动了 Firefox，但我现在似乎无法重现该问题。

Answer 2

如果我没记错的话，你会遇到一些语法/链接问题：

var dialogId = 'uniqueName-' + Math.floor(Math.random() * 1000)
//var dialogDiv = $(document.createElement('div')).attr("id", dialogId);
//dialogDiv equals the attribute 'id'
//try and console.log(dialogDiv) right here. what I think you want is:

var dialogDiv = $("<div />");
dialogDiv.attr("id", dialogId).load(this.href, function () {
    var dialog = $(this).dialog({ autoOpen: false });
    ...
});

我也不认为这是初始化您正在尝试做的事情的正确方法...您能在您的页面上描述发生了什么吗？

你可能会考虑做这样的事情：

var dialogId = 'uniqueName-' + Math.floor(Math.random() * 1000);
//Build some HTML here in the dialog div, or in a string.
theHTML = $('#'+dialogId).html() || "<p>This is a string of HTML</p>";
$('body').on('click', ".button" function () {
    console.log($.ui);
    $.dialog({autoOpen:true, html: theHTML})
});