JQuery 对话框未出现在当前屏幕中心答案

【问题标题】：JQuery dialog box not appearing in current screen centerJQuery 对话框未出现在当前屏幕中心
【发布时间】：2012-09-07 15:30:47
【问题描述】：

我有一个测试 php 文件，它在一个表中有 50 个按钮（只是为了制作一个大表）。单击第一个按钮时，我想要一个 JQuery 对话框，它有一个通过 JQuery 打开的 html 文本框。目前，代码打开文本框，但位于屏幕底部。那是在桌子下面。我的目标是在当前屏幕的中心打开，即不被用户向下滚动。这是我的代码：

 <html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.js"></script>
       <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.js">
**<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css" rel="stylesheet" type="text/css" />**
</script>
        <script type="text/javascript" >
         $(document).ready(function(){
                  showClick();
        });

        function showClick(){ $('#comment0').click(function(ez) {
        $('#0').dialog('open');
        ez.preventDefault();
        return false;
    });
    $('#0').dialog({
        autoOpen: false,
        modal: true,
        resizable: false,
        title: 'haha',
        height: 'auto',    
        draggable: true,
        position: 'center'
    }); }


    </script>
    </head>
    <body>
    <?php
        ?><div id="0"><input type="text" ></div>
        <?php
        echo "<table>";
        for($i=0; $i<50; $i++) {?>
            <tr>
            <td><input type="button" class="comment0" value="Comment" id="comment0"></td>
            </tr>
            <!--div id="<?php echo $i; ?>" style="display :none"><input type="text" ></div-->       
            <?php
        } ?>
    
    <?php
        echo "</table></body></html>";
    ?>

注意：这是一个快速的脏代码，我只是在测试 JQuery 在大表大小下的行为。我在这里做错了什么？

感谢您的帮助！

编辑：原来你必须导入 JQuery CSS。现在的问题是，对话框在表格的中心打开。对话框是否可以在当前屏幕的中心打开？谢谢！

【问题讨论】：

标签： php jquery html jquery-ui

【解决方案1】：

添加 jquery UI 样式表

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css" rel="stylesheet" type="text/css" />

【讨论】：

什么？太简单！哈哈。这件事让我头疼了两天！非常感谢！！
等待.. 现在在表格的中心打开。无论如何不这样做吗？谢谢！我将编辑我的原始帖子。
@javaCity dialog() 有 [position()] (stackoverflow.com/questions/3816250/…)
@nonnb 是的，我知道这一点。即使我做了 position: 'center' ，它也会进入整个桌子的中心。我希望它位于当前屏幕的中心。
我试过位置：“固定”和“绝对”，它们似乎都不起作用。无论我做什么，它都以桌子为中心。

【解决方案2】：

我终于弄清楚我的程序出了什么问题。在 HTML 中，我没有提供

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

给出这个之后，对话框就在当前屏幕居中了！

【讨论】：