2

セクションとそこに含まれるページを含む jstree を表示しようとしています。それぞれのタイプを設定しましたが、ページ タイプのアイコンを変更できません。デフォルトのフォルダ アイコンが表示されたままです。

これは私のJavaScriptです：

$('#demo1').jstree({ 
        "themes" : {
            "theme" : "default",
            "dots" : false,
            "icons" : true
        },
        "types" : {
            "section" : {
                "max_children"  : -1,
                "max_depth"     : -1,
                "valid_children": "all",
                "type_attr"     : "section"
            },
            "page" : {
                "max_children"  : 0,
                "max_depth"     : -1,
                "valid_children": "none",
                "icon" : { 
                        "image" : "http://static.jstree.com/v.1.0rc/_docs/_drive.png" 
                    },
                "type_attr"     : "page"
            }
        },
        "core" : {"html_titles" : true,  "load_open" : true },
        "plugins" : [ "themes", "json_data", "ui", "cookies", "crrm", "sort", "types" ],
        "json_data" : {
            "ajax" : {
                "type": 'GET',
                "url" : function (node) { 

                    var url = ""

                    if (node == -1)
                    {
                        url = 'localhost/sections';
                    }
                    else
                    {
                        url = 'localhost/sections/'+node.attr("id");
                    }

                    return url;
                },
                "type" : "get",  
                "success" : function(items) {

                  data = []

                  for (i in items) {

                    var item = items[i]
                    var type;

                    if (JSON.stringify(items[i].root)) {

                        type = "section";

                        node = {
                        "data" : item.title, 
                        "attr" : { "id" : item.id, "rel" : type }, 
                        "state" : "closed"
                        }

                    } else {

                        type = "page";

                        node = {
                        "data" : item.title, 
                        "attr" : { "rel" : type }, 
                        "state" : "open"
                        }
                    }

                    this.set_type(type, node);
                    data.push(node);

                  }

                return data; 

            }
        }
    }
});

これは、AJAX 呼び出しによって生成された HTML です。

<div id="demo1" class="demo jstree jstree-0 jstree-focused jstree-default" style="height:100px;">
   <ul class="jstree-no-dots">
      <li id="1" rel="section" class="jstree-open">
         <ins class="jstree-icon">&nbsp;</ins><a href="#" class="jstree-clicked"><ins class="jstree-icon">&nbsp;</ins>One</a>
         <ul>
            <li id="3" rel="section" class="jstree-closed"><ins class="jstree-icon">&nbsp;</ins><a href="#" class=""><ins class="jstree-icon">&nbsp;</ins>One Subsection</a></li>
            <li rel="page" class="jstree-open jstree-last"><ins class="jstree-icon">&nbsp;</ins><a href="#" class=""><ins class="jstree-icon">&nbsp;</ins>Page in section one</a></li>
         </ul>
      </li>
      <li id="2" rel="section" class="jstree-closed jstree-last"><ins class="jstree-icon">&nbsp;</ins><a href="#"><ins class="jstree-icon">&nbsp;</ins>Two</a></li>
   </ul>
</div>

何が問題なのか誰にもわかりますか？

アドバイスをいただければ幸いです。

ありがとう

4

2 に答える 2

1

ここで 3.0 を使用している人にとっては、今は違います。

この問題から: https://github.com/vakata/jstree/issues/497

タイプは rel 属性から読み取られません。マークアップで使用<li data-jstree='{ "type" : "floor" }'...してみてください (data-jstree 属性の単一引用符を外側に、二重引用符を内側にしてください)。

だから鍵は

<li data-jstree='{ "type" : "section" }'>...</li>
于 2014-04-15T22:06:30.343 に答える
1

この回答がまだ役立つかどうかはわかりませんが、jsTree で同様の問題が発生しており、あなたの質問を見つけました

この設定は正しいですか？あなたが持っている：

    "types" : {
        "section" : {
            "max_children"  : -1,
            "max_depth"     : -1,
            "valid_children": "all",
            "type_attr"     : "section"
        },
        "page" : {
            "max_children"  : 0,
            "max_depth"     : -1,
            "valid_children": "none",
            "icon" : { 
                    "image" : "http://static.jstree.com/v.1.0rc/_docs/_drive.png" 
                },
            "type_attr"     : "page"
        }

そうあるべきだと思う

    "types" : {
        "type_attr"     : "rel",            // you can remove this. the rel attribute is the default
        "types"         : {
            "section"   : {
                "max_children"  : -1,
                "max_depth"     : -1,
                "valid_children": "all"
            },
            "page" : {
                "max_children"  : 0,
                "max_depth"     : -1,
                "valid_children": "none",
                "icon" : { 
                        "image" : "http://static.jstree.com/v.1.0rc/_docs/_drive.png" 
                    }
            }
        }

Types オブジェクトにはいくつかのプロパティ (オプション) が含まれており、各タイプを含むtype_attrネストされたプロパティも含まれていることに注意してください。Types

私が読んだドキュメントに基づいて、jsTree ライブラリは を調べtype_attrてノードの値を取得し、それを値のリストと比較しますTypes.Types

于 2014-02-17T02:09:42.367 に答える