使用JQuery UI打开对话框

Question

我想在用户点击链接时打开JQuery UI对话框.到目前为止,我有这个

<script>
    //to hide the dialog box on loading
    $j(function() {
        $j( "#dialog" ).hide();
    });

    $('.button').click(function(){
        $('#dialog').dialog('open');
    });
</script>

<div id="dialog" title="Basic dialog">
    <p>Dialog box</p>
</div>

<a href="#" class="button">The button</a>

但单击链接无法打开对话框......一切都包含在内.

编辑

<script type="text/javascript" language="javascript" src="js/jquery-1.6.2.js"></script>
<script>
    var $j = jQuery.noConflict();
</script>
<script type="text/javascript" language="javascript" src="js/ui/jquery.ui.core.js"></script>
<script type="text/javascript" language="javascript" src="js/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" language="javascript" src="js/ui/jquery.ui.dialog.js"></script>
<script type="text/javascript" language="javascript" src="js/ui/jquery.effects.core.js"></script>

Answer 1

你在引用jQuery和jQuery ui库吗？初始化时可以自动隐藏:

$("#dialog").dialog({ autoOpen: false });


$('.button').click(function() {
    $('#dialog').dialog('open');
});

演示:http://jsfiddle.net/pxQ8j/