0

テーブルセル内にjsTreeを作成しています。

展開しないツリーは次のようになります。

ここに画像の説明を入力

しかし、ルートノードをクリックすると。表のセルを展開します。

ここに画像の説明を入力

表のセルを展開しないでください。

私のコードは次のとおりです。

<table border="1" cellpadding="0"cellspacing="0" width="100%" style="margin-top:10px;">
                <tr>
                    <td style="padding-left:5px;">PCA</td>
                    <td id="population"></td>
                    <td id="sex"></td>
                    <td id="literacy"></td>
                </tr>
            </table>

<script type="text/javascript">
            $(function () {
                $("#population").jstree({ 

                    "html_data" : {
                        "data" : "<?php echo $populationdata;?>"
                    },
                    "plugins" : [ "themes", "html_data","ui","checkbox" ]
                });
                $("#sex").jstree({ 

                    "html_data" : {
                        "data" : "<?php echo $sexdata;?>"
                    },
                    "plugins" : [ "themes", "html_data","ui","checkbox" ]
                });
                 $("#literacy").jstree({ 

                    "html_data" : {
                        "data" : "<?php echo $literacydata;?>"
                    },
                    "plugins" : [ "themes", "html_data","ui","checkbox" ]
                });

            });
        </script>

これにはオーバーレイメソッドを使用することを考えましたが、次の変更を加えました

<table border="1" cellpadding="0"cellspacing="0" width="100%" style="margin-top:10px;">
                <tr>
                    <td style="padding-left:5px;">PCA</td>
                    <td><div id ="overlay"><div id="population"></div></div></td>
                    <td><div id ="overlay"><div id="sex"></div></div></td>
                    <td><div id ="overlay"><div id="literacy"></div></div></td>
                </tr>
            </table>

#overlay {
    position: fixed;
    z-index: 10000;
}

しかし今、ツリーは次のようになります。

ここに画像の説明を入力

この問題を解決するにはどうすればよいですか?

4

1 に答える 1