【问题标题】:jsTree not rendering list properly?jsTree 没有正确渲染列表?
【发布时间】:2015-01-16 20:56:42
【问题描述】:

我正在尝试使用 jsTree 并浏览他们网站上的第一个示例只会产生一个普通列表,而不是树风格化。我有这个 div

  <div id="jstree">
    <!-- in this example the tree is populated from inline HTML -->
    <ul>
      <li>Root node 1
        <ul>
          <li id="child_node_1">Child node 1</li>
          <li>Child node 2</li>
        </ul>
      </li>
      <li>Root node 2</li>
    </ul>
  </div>

这个 javascript 在底部。

<script type="text/javascript"> $(document).ready(function () { $("#jstree").jstree(); }); </script>

列表正常显示,只是普通的 HTML,而不是应有的树。控制台中没有错误。

jsTree js文件在jquery1.9.1之后包含在Site.Master文件中,通过MasterPageFile链接到这个页面。

我在网站上使用 ASP.NET,我认为这无关紧要,但也许确实如此?我认为这很简单。

我假设我错过了一些简单的东西,有什么想法吗?

【问题讨论】:

  • 如果您在客户端查看您的 div 的 ID,它是否与服务器上的匹配?
  • @mason 我不确定你的意思。在我的 aspx 页面中,div id 是 jstree。当我运行页面并检查元素时,div id 仍然是 jstree。还是你的意思是别的?
  • 默认情况下,客户端和服务器上的 ID 不同(当使用母版页或其他合成技术时)。这是一个重要的区别。请参阅我对this question 的回答。但是,如果您在检查生成的 HTML 时确定客户端的 ID 是 jstree,那么您遇到了不同的问题。

标签: javascript asp.net asp.net-mvc jstree


【解决方案1】:

刚遇到同样的问题,结果发现样式丢失了。我知道自从 OP 提出这个问题以来已经两年多了,但是任何面临同样问题的人都可以在添加这些问题并修复相对路径后试一试:

<link rel="stylesheet" href="../js/themes/default/style.min.css">
<link rel="stylesheet" href="../js/themes/default-dark/style.min.css">

编辑: 由于 jQuery 链接损坏,jstree.zip 中的演示文件无法工作。替换:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

与:

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

(或在您处理此问题时使用另一个最新链接)瞧!

【讨论】:

  • OP 提出这个问题可能已经 2 年了,但在那之后将近 3 年,您的回答帮助了我!谢谢!
  • @Sterno 很高兴听到这个消息!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2021-01-02
  • 2021-07-22
  • 2019-08-06
  • 1970-01-01
  • 1970-01-01
  • 2018-05-04
  • 2017-08-17
相关资源
最近更新 更多