jsTree 不工作答案

【问题标题】：jsTree not workingjsTree 不工作
【发布时间】：2012-04-27 07:08:58
【问题描述】：

我是 jQuery 和 jsTree 的新手，我不知道为什么我不能让它工作？使用本教程： http://tkgospodinov.com/jstree-part-1-introduction/

还有这个html/javascript：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta name="description" content="">
        <title>
            BLA BLA
        </title>
        <base href="/">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!--
        <link rel="stylesheet" href="css/styles.css">
        -->
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> </script>
        <script type="text/javascript" src="jquery.jstree.js"></script>
        <script type="text/javascript">                                         
        $(document).ready(function() {
             $("#selector").jstree();
        });                                     
        </script>
        </head>
        <body>
            <div id="selector">
                <ul>
                    <li><a>Team A's Projects</a>
                        <ul>
                        <li><a>Iteration 1</a>
                            <ul>
                                <li><a>Story A</a></li>
                                <li><a>Story B</a></li>
                                <li><a>Story C</a></li>
                            </ul>
                            </li>
                        <li><a>Iteration 2</a>
                        <ul>
                            <li><a>Story D</a></li>
                              </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </body>
</html>

似乎没有任何效果。我收到以下错误：

$("#selector").jstree is not a function

【问题讨论】：

标签： jquery html jstree

【解决方案1】：

您的示例的工作演示：JSFiddle1 和 JSFiddle2

请检查参考以及您如何称呼它。这棵树应该与您正在寻找的完全一样。

其余所有文档的来源可以在这里找到：http://www.jstree.com/

<script type="text/javascript" src="http://static.jstree.com/v.1.0pre/jquery.jstree.js"></script>

包括下面提到的文件。见demo here。

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>

<link rel="stylesheet" type="text/css" href="/css/normalize.css">
<link rel="stylesheet" type="text/css" href="/css/result-light.css">

<script type='text/javascript' src="http://static.jstree.com/v.1.0pre/jquery.jstree.js"></script>

【讨论】：

我按照你在示例中所做的，现在我得到：ncaught exception: jsTree hotkeys: jQuery hotkeys plugin not included.
嗨 @ArthurWulfWhite 检查上面的答案你缺少 hotkey.js <script type='text/javascript' src="http://static.jstree.com/v.1.0pre/jquery.hotkeys.js"></script> 包括你可以从上面复制粘贴链接。 用外部文件从头更新了另一个 jsfiddle jsfiddle.net/J5ZaK/2 让我知道它是怎么回事 :) 干杯！
再次感谢 Tats，这很好用！您是如何找到静态链接的？
不用担心@ArthurWulfWhite 很高兴它有帮助，MAGIC 开玩笑，我去了 jstree 文档并查看了其中一个演示的源代码并获得了源代码。 :) 祝你好运，cheerios

【解决方案2】：

您的浏览器似乎没有正确加载 jstree.js？

您可以尝试从 CDN（内容分发网络）加载 jstree.js，就像通过更改行加载 jquery 一样：

<script type="text/javascript" src="jquery.jstree.js"></script>

到

<script type="text/javascript" src="http://cachedcommons.org/cache/jquery-jstree/1.0.0/javascripts/jquery-jstree-min.js"></script>

【讨论】：

是的！这似乎可行，但现在我得到了一棵看起来很奇怪的树。 ://

【解决方案3】：

在我看来，您的代码无法访问函数jstree()。也许 jstree.js 的路径有问题？

<script type="text/javascript" src="jquery.jstree.js"></script>

【讨论】：

这很奇怪，我在发布前检查了五次..文件与html在同一目录中..我复制粘贴了文件名，所以它应该是正确的。