javascript - jquery.gantt插件不执行任何操作

我正在尝试做的是：
安装jquery.gantt插件并运行docs中给出的基本示例。

如何失败：
javascript不会执行任何操作，目标DOM保持不变。

我做了什么：
我检查了css文件style.css和js jquery.fn.gantt.js是否已安装。
我检查了图像是否已安装。
我看了看文档的来源。

一些代码：我以文档中的示例为例，但从未设法使其工作。

    <script type="text/javascript">
<!--
        $(".ganttdiv").gantt({
            source:  [{
                name: "Example",
                desc: "Lorem ipsum dolor sit amet.",
                values: [ {
                    to: "/Date(1328832000000)/",
                    from: "/Date(1333411200000)/",
                    desc: "Something",
                    label: "Example Value",
                    customClass: "ganttRed",
                    dataObj: foo.bar[i]
                }]
            }],
            scale: "weeks",
            minScale: "weeks",
            maxScale: "months",
            onItemClick: function(data) {
                alert("Item clicked - show some details");
            },
            onAddClick: function(dt, rowId) {
                alert("Empty space clicked - add an item!");
            }
        });


//-->
</script>
<div class="ganttdiv"></div>

我的问题：

我想了解我做错了什么，或者只是想看看Jquery.gantt的工作示例的代码。任何有关如何调试此问题的建议也将不胜感激。

最佳答案

好吧，我设法使其正常工作。

默认的css会强制您将class ='gantt'放在目标DOM上，而不是像我所做的那样'ganttdiv'。

这是一个工作示例，希望对某人有用。

<script type="text/javascript">
<!--
    $(  function(){$(".gantt").gantt({
            source:  [{
                name: "Example",
                desc: "Lorem ipsum dolor sit amet.",
                values: [ {
                    to: "/Date(1376954000000)/",
                    from: "/Date(1375854000000)/",
                    desc: "Something",
                    label: "Example Value",
                    customClass: "ganttRed",
                }]
            }],scale: "weeks",
            minScale: "weeks",
            maxScale: "months",
            navigate:"scroll",

            onItemClick: function(data) {
                alert("Item clicked - show some details");
            },
            onAddClick: function(dt, rowId) {
                alert("Empty space clicked - add an item!");
            }
        });
});

//-->
</script>
<div class="gantt"></div>