如何让 jstree 工作

发布于 2024-09-16 00:10:45 字数 2791 浏览 10 评论 0原文

这是我的文件 omploader.org/vNWJieg/1.png:

这是我的代码:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>jsTree v.1.0 - full featured demo</title>
 <script type="text/javascript" src="_lib/jquery.js"></script>
 <script type="text/javascript" src="_lib/jquery.cookie.js"></script>
 <script type="text/javascript" src="_lib/jquery.hotkeys.js"></script>
 <script type="text/javascript" src="jquery.jstree.js"></script>
 <link rel="stylesheet" type="text/css" href="_docs/!style.css" />
 <style type="text/css">
 html, body { margin:0; padding:0; }
 body, td, th, pre, code, select, option, input, textarea { font-family:verdana,arial,sans-serif; font-size:10px; }
 .demo, .demo input, .jstree-dnd-helper, #vakata-contextmenu { font-size:10px; font-family:Verdana; }
 #container { width:780px; margin:10px auto; overflow:hidden; position:relative; }
 #demo { width:auto; height:400px; overflow:auto; border:1px solid gray; }

 #text { margin-top:1px; }

 #alog { font-size:9px !important; margin:5px; border:1px solid silver; }
 </style>
</head>
<body>
<div id="demo1">
 <a href="some_value_here">Node title</a>
 <ul>
  <li>
   saaa
   <!-- UL node only needed for children - omit if there are no children -->
   <ul>
    <li>aaa</li>
    <li>sss</li>
   </ul>
  </li>
 </ul>

</div>
<script type="text/javascript">
 $(function () {
 $("#demo1").jstree({ 
  "themes": {
         "theme": "default",
         "dots": true,
         "icons": true,
         "url": "themes/default/style.css"
       },
  "plugins" : [ "themes", "html_data" ]
 });
});
</script>
</body>
</html>

我的结果是 omploader.org/vNWJibg:

你可以看到,它没有任何主题,

那么如何让它工作,

谢谢

更新:

这是我的结果图片:omploader.org/vNWJjbQ/1.png

如何让它工作。

updated2

哦,我明白了,它一定是

  • 中的 元素,
  • 这是我的代码:

    <div id="demo1">
        <ul>
            <li>
                <a href="">aaa</a>
                <!-- UL node only needed for children - omit if there are no children -->
                <ul>
                    <li><a href=""> kkk</a></li>
                    <li><a href=""> kkk</a></li>
                </ul>
            </li>
        </ul>
    
    </div>
    

    this is my file omploader.org/vNWJieg/1.png:

    and this is my code:

    <!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>jsTree v.1.0 - full featured demo</title>
     <script type="text/javascript" src="_lib/jquery.js"></script>
     <script type="text/javascript" src="_lib/jquery.cookie.js"></script>
     <script type="text/javascript" src="_lib/jquery.hotkeys.js"></script>
     <script type="text/javascript" src="jquery.jstree.js"></script>
     <link rel="stylesheet" type="text/css" href="_docs/!style.css" />
     <style type="text/css">
     html, body { margin:0; padding:0; }
     body, td, th, pre, code, select, option, input, textarea { font-family:verdana,arial,sans-serif; font-size:10px; }
     .demo, .demo input, .jstree-dnd-helper, #vakata-contextmenu { font-size:10px; font-family:Verdana; }
     #container { width:780px; margin:10px auto; overflow:hidden; position:relative; }
     #demo { width:auto; height:400px; overflow:auto; border:1px solid gray; }
    
     #text { margin-top:1px; }
    
     #alog { font-size:9px !important; margin:5px; border:1px solid silver; }
     </style>
    </head>
    <body>
    <div id="demo1">
     <a href="some_value_here">Node title</a>
     <ul>
      <li>
       saaa
       <!-- UL node only needed for children - omit if there are no children -->
       <ul>
        <li>aaa</li>
        <li>sss</li>
       </ul>
      </li>
     </ul>
    
    </div>
    <script type="text/javascript">
     $(function () {
     $("#demo1").jstree({ 
      "themes": {
             "theme": "default",
             "dots": true,
             "icons": true,
             "url": "themes/default/style.css"
           },
      "plugins" : [ "themes", "html_data" ]
     });
    });
    </script>
    </body>
    </html>
    

    my result is omploader.org/vNWJibg :

    you can see ,it does not has any themes ,

    so how to get it work ,

    thanks

    updated:

    this is my result pic : omploader.org/vNWJjbQ/1.png

    how to get it work .

    updated2

    oh , i got it , it must be <a> element in the <li>

    this is my code :

    <div id="demo1">
        <ul>
            <li>
                <a href="">aaa</a>
                <!-- UL node only needed for children - omit if there are no children -->
                <ul>
                    <li><a href=""> kkk</a></li>
                    <li><a href=""> kkk</a></li>
                </ul>
            </li>
        </ul>
    
    </div>
    

    如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

    扫码二维码加入Web技术交流群

    发布评论

    需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

    评论(1

    猥︴琐丶欲为 2024-09-23 00:10:45

    您的 div 上似乎没有 ID。将

    更改为

    It looks like you don't have an ID on your div. Change <div id=""> to <div id="demo1">.

    ~没有更多了~
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文