jsTree not working | 易学教程

问题

I am new to jQuery and jsTree and I am not sure why I can't get it working? Using this tutorial: http://tkgospodinov.com/jstree-part-1-introduction/

And this 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>

Nothing seems to work. I get the following error:

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

回答1:

Working demo of your example: JSFiddle1 and JSFiddle2

Please check the reference and how you are calling it. This tree should be exactly the same as what you are looking for.

Rest the source of all the documentation can be found here: http://www.jstree.com/

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

Include the files mentioned below. See 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>

回答2:

It looks like your browser just isn't loading jstree.js properly?

You can try loading jstree.js from CDN (content delivery network) just like jquery is being loaded by changing the line:

<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:

It seems to me that your code can't access to the function jstree(). Maybe something is wrong on the path to jstree.js?

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

来源：https://stackoverflow.com/questions/10346271/jstree-not-working

标签

jquery

html

jstree