jquery - div.dialog() 不生成对话框

Question

我正在使用 jQuery 创建一个对话框，其中包含来自名为“dialog-tatto”的 div 的内容。但由于某种原因，它不起作用。这是我当前的代码：

    var button = $(".ui-dialog-buttonpane button:contains(\"New\")"); 
    $(button).show();
    button = $(".ui-dialog-buttonpane button:contains(\"Update\")");
    $(button).hide();
    $("#dialog-tattoo").dialog("open");

这是我的 div：

            <div id="dialog-tattoo">
            <table>
                <tr>
                    <td>
                        <asp:Label ID="lblPersonMarkType" runat="server" Text="Mark type:" meta:resourcekey="lblPersonMarkTypeResource1" />
                        <asp:DropDownList ID="ddlPersonMarkType" Width="120px" runat="server" AppendDataBoundItems="True"
                            DataSourceID="dsPersonMarkType" DataTextField="ScarTattooName" DataValueField="ScarTattooTypeID"
                            OnPreRender="ddl_PreRender" meta:resourcekey="ddlPersonMarkTypeResource1">
                            <asp:ListItem Value="-1" meta:resourcekey="ListItemResource1">--Select--</asp:ListItem>
                        </asp:DropDownList>
                    </td>
                    <td>
                        <asp:Label ID="lblPersonBodyLocation" runat="server" Text="Body Location:" meta:resourcekey="lblPersonBodyLocationResource1" />
                        <asp:DropDownList ID="ddlPersonBodyLocation" Width="120px" runat="server" AppendDataBoundItems="True"
                            DataSourceID="dsPersonBodyLocation" DataTextField="BodyLocation" DataValueField="BodyLocationID"
                            OnPreRender="ddl_PreRender" meta:resourcekey="ddlPersonBodyLocationResource1">
                            <asp:ListItem Value="-1" meta:resourcekey="ListItemResource1">--Select--</asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td colspan='2'>
                        <asp:Label ID="lblPersonMarkDescription" runat="server" Text="Description:" meta:resourcekey="lblPersonMarkDescriptionResource1" />
                        <asp:TextBox ID="txtPersonMarkDescription" runat="server" Height="40px" TextMode="MultiLine"
                            Width="400px" meta:resourcekey="txtPersonMarkDescriptionResource1" />
                    </td>
                </tr>
            </table>
        </div>

Answer 1

用这个

$("#dialog-tattoo").dialog();

代替

$("#dialog-tattoo").dialog("open");

演示。

更新：（带标题）

$("#dialog-tattoo").dialog({
    title:'This is my Title'
});

演示。

更新：（对于动态按钮）

$("<div/>",{
    'text':'Button',
    'id':'btn1',
    'class':'myBtn',
    'style':'margin:5px;color:green;'
}).button().appendTo('body');

演示。