java - 将 JavaScript 资源插入 Liferay Portlet

Question

我想使用jsTree在我的 Liferay portlet 内部，但每次执行脚本时都会收到错误:

TypeError: treeContainer.jstree is not a function @ localhost:8080/web/guest/home:14

据我了解，它没有可用的 JS 文件，因此我尝试了这两种方法，但都不起作用。

第一:通过添加直接包含它

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

进入 JSP。虽然我可以看到它在我的 IDE 中“链接”，但在构建和部署之后它不可用(废话)。

第二:在liferay-portlet.xml中编辑它，如下所示:

<portlet>
    <portlet-name>myPortlet</portlet-name>
    <instanceable>false</instanceable>
    <!-- other mappings here -->
    <header-portlet-javascript>my/resource/folder/myPortlet/jquery.jstree.js
    </header-portlet-javascript>
</portlet>

但即使我像这样编辑它，我也会在浏览器控制台中收到 404 错误。

JSP中使用的函数:

<script type="text/javascript">
$(".tree-search").click(function(){

    treeContainer = $(this).siblings('.tree-container');

    // correct data is taken from ${jsonFake}
    treeContainer.jstree({
        "plugins":["themes","html_data","ui"], "json_data": { data: ${jsonFake}}
    });

    treeContainer.show();
    treeContainer.animate({
        opacity: "1"
    }, 750);

});
</script>

请问我做错了什么？

Answer 1

这似乎是路径问题:

在 docroot 中创建一个名为 js 的文件夹并将此文件放在那里。添加脚本 src，例如:

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