无法关闭jQuery UI对话框

Question

以下是打开/关闭对话框和HTML链接的代码的jquery：

$("#security-code-link").click(function() {
    $("#security-code-box").dialog({ 
        draggable: false, 
        height: 500,
        modal: true,
        position: ["center","center"], 
        resizable: false, 
        width: 500
    });
});

$("#close-security-code-link").click(function() {
        $("#security-code-box").dialog("close");
});


<a id="security-code-link">Where is this?</a>
<div id="security-code-box">
<h3>Where is my security code?</h3>
<div class="center">
    <img src="<?php bloginfo("template_directory"); ?>/images/security-codes.jpg" />
    <br /><a id="close-security-code-link">Close this box</a>
</div>
</div>

为什么对话框没有关闭？

Answer 1

试试这个：

$(function () {
    $("#security-code-box").dialog({ 
        draggable: false, 
        height: 500,
        modal: true,
        position: ["center","center"], 
        resizable: false, 
        width: 500,
        autoOpen: false
    });
    $("#security-code-link").live('click', function() {
       $("#security-code-box").dialog('open');
    });
    $("#close-security-code-link").live('click', function() {
       $("#security-code-box").dialog("close");
    });
});

Answer 2

适合我：http://jsfiddle.net/muF8S/1/

确保您的脚本在准备好的功能中。