0

テーブルに50個のボタンがあるテストphpファイルがあります(大きなテーブルを作成するためだけです)。最初のボタンがクリックされたときに、htmlテキストボックスを含むJQueryダイアログボックスをJQuery経由で開く必要があります。今のところ、コードはテキストボックスを開きますが、画面の下部にあります。それは表の下にあります。私の目的は、現在の画面の中央で開くことです。つまり、ユーザーが下にスクロールすることはありません。これが私のコードです:

 <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の動作をテストしていました。私はここで何が間違っているのですか?

助けてくれてありがとう!

編集:JQueryCSSをインポートする必要があることがわかりました。問題は、テーブルの中央にダイアログボックスが開くことです。現在の画面の中央にダイアログボックスを開く方法はありますか?ありがとう!

4

2 に答える 2

3

jqueryUIスタイルシートを追加します

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

于 2012-09-07T15:37:47.327 に答える
2

私はついに自分のプログラムの何が悪いのかを理解しました。HTMLでは、私は提供していませんでした

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

これを与えた後、ダイアログボックスは現在の画面の中央に配置されました!

于 2012-09-10T13:17:24.680 に答える