jquery - JStree 设置链接 href 和重定向

Question

我在我的rails应用程序中使用jstree，并且我使用json数据，但是我遇到了麻烦:如何为它设置节点链接和href，以便我可以继续它？ Json 看起来像这样:

var data = [
{
   "data":"\u041b\u0435\u0433\u043a\u043e\u0432\u044b\u0435 \u0430\u0432\u0442\u043e\u043c\u043e\u0431\u0438\u043b\u0438",
   "href":10001,
   "children":[
      {
         "data":"\u041a\u0443\u0437\u043e\u0432",
         "href":10101,
         "children":[
            {
               "data":"\u0422\u043e\u043f\u043b\u0438\u0432\u043d\u044b\u0439 \u0431\u0430\u043a / \u043a\u043e\u043c\u043f\u043b\u0435\u043a\u0442\u0443\u044e\u0449\u0438\u0435",
               "href":10316
            },
            {
               "data":"\u041a\u0440\u0435\u043f\u043b\u0435\u043d\u0438\u0435 \u0440\u0430\u0434\u0438\u0430\u0442\u043e\u0440\u0430",
               "href":10317
            },
            {
               "data":"\u041e\u0431\u043b\u0438\u0446\u043e\u0432\u043a\u0430 / \u0437\u0430\u0449\u0438\u0442\u0430 / \u043e\u0444\u043e\u0440\u043c\u043b\u0435\u043d\u0438\u0435 / \u044d\u043c\u0431\u043b\u0435\u043c\u044b / \u0437\u0430\u0449\u0438\u0442\u0430 \u0440\u0430\u0441\u043f\u044b\u043b.",
               "href":10319,
               "children":[
                  {
                     "data":"\u041e\u0431\u043b\u0438\u0446\u043e\u0432\u043a\u0430/\u0437\u0430\u0449\u0438\u0442\u043d\u0430\u044f \u043d\u0430\u043a\u043b\u0430\u0434\u043a\u0430",
                     "href":10840
                  },
                  { ................................

还有js

$("#tree").jstree({
    plugins: ['themes', 'json_data'],
    json_data: {data: data},
      themes: {
          theme: 'apple'
      },   
  });
  $('#tree').bind('select_node.jstree', function(e,data) { 
    window.location.href = "123123"
});

但如果我看到代码，链接有 href =“#”。怎么了？

Answer 1

JSTree Node 对象没有 href 属性。如果您想设置它，则必须使用 attr 属性并包含一个键值对数组，用于标识任何属性JSTree 将放置在您的 HTML 输出中..考虑以下示例:

$(function () {
$("#demo1").jstree({ 
    "json_data" : {
        "data" : [
            { 
                "data" : "A node", 
                "metadata" : { id : 23 },
                "children" : [ "Child 1", "A Child 2" ]
            },
            { 
                "attr" : { "id" : "li.node.id1" }, 
                "data" : { 
                    "title" : "Long format demo", 
                    "attr" : { "href" : "#" } 
                } 
            }
        ]
    },
    "plugins" : [ "themes", "json_data", "ui" ]
}).bind("select_node.jstree", function (e, data) { alert(data.rslt.obj.data("id")); });
});

并遵循 DOC:

JSTree JSON-DATA pulgin DOC