javascript - 用jQuery打开对话框

我有一个由$ imageDialog引用的对话框，我试图用$imageDialog.dialog("open")打开它，但是它不起作用。

问题是，通过调试，我已经看到$imageDialog.dialog("open")行正在执行，但是$ imageDialog中的open函数不会执行。它没有显示任何错误，我在执行$imageDialog.dialog("open")时检查了$ imageDialog的引用设置是否正确。

这是html对话框：

<div class="dialog" id="image-dialog"></div>

这是JavaScript代码：

var selectedImage;
var $imageDialog = $("#image-dialog");

$imageDialog.dialog({
    autoOpen: false,
    buttons: [
        {
            text: "Cerrar",
            icons: {
                primary: "ui-icon-close"
            },
            click: function() {
                $(this).dialog("close");
            }
        }
    ],
    maxHeight: 580,
    modal: true,
    position: { my: "top", at: "top+160" },
    resizable: false,
    title: "Vista de imagen",
    width: 1000,
    close: function() {
        $imageDialog.empty();
    },
    open: function() {
        content += "         <img alt='previsualizacion'" + "src='" + imageSrc + "'>";

        $imageDialog.append(content);
    }
});

function showImage(img) {
    selectedImage = img.src;
    console.log($imageDialog);
    $imageDialog.dialog("open");
}

最佳答案

要打开JQuery UI对话框，只需使用：

jQuery：

$(document).ready(function(){
    $('#dialog').dialog();
});

HTML：

<div id="dialog">

</div>

Working Fiddle