JQtree: Ассоциирование URL с узлом

Question

я хочу что-то очень простое:

A JQuery виджета, который представляет дерево, которое является разборным. Я хочу, чтобы состояние было сохранено. И я хочу контролировать, что такое начальное состояние. Я хочу, чтобы он выглядел очень красиво. И когда пользователь нажимает на ссылку, я хочу, чтобы она перемещалась туда. Легко.

Мне кажется, что Jqtree - это то, что я ищу, но просматривая все документы, я не вижу простого случая указания URL-адреса, который идет с узлом в дереве.

• Учитывая мои требования, согласны ли вы, что Jqtree является правильным решением
• Есть полезный образец где я могу посмотреть, чтобы увидеть, как мой случай обрабатывается

Спасибо!

Answer 1

Узлы - это только объекты Javascript, поэтому вы можете просто добавить другое свойство для URL-адреса. Так, например, адаптируя что на jqTree сайте:

var data = [ 
    { 
     label: 'node1', 
     url: 'MyUrl.html', 
     children: [ 
      { label: 'child1', url: 'anotherURL.html' }, 
      { label: 'child2', url: 'andAnotherURL.html' } 
     ] 
    }, 
    { 
     label: 'node2', 
     url: 'www.your.get.the.point.com', 
     children: [ 
      { label: 'child3', url: 'google.com' } 
     ] 
    } 
]; 

Теперь, очевидно jqTree не будет ничего делать с этим по умолчанию, так что вам придется справиться с этим, но в любое время вы можете получить узел, вы должны быть в состоянии получить это .url:

var theURL = myNode.url; 

Так, например, это выглядит как jqTree имеет tree.click event:

$('#tree1').bind(
    'tree.click', 
    function(event) { 
     // The clicked node is 'event.node' 
     var node = event.node; 
     var theURL = node.url; 
     if (theURL) { 
      location.href = theURL; 
     } 
    } 
); 

Answer 2

для posterit y, я вместо этого предлагаю сделать это таким образом, чтобы сохранить элементы в качестве встроенных ссылок, чтобы сохранить возможность открытия в новой вкладке/окне, скопировать URL-адрес и т. д.

(Предполагая, что ваши узлы имеют URL-адрес сохраняется, как и в других ответов)

$tree.tree({ 
    data = whatever; 
    onCreateLi: function(node, $li) { 
     $li.find('.jqtree-title').wrap('<a href="' + node.url + '"></a>'); 
    } 
}); 

UPDATE:

Это более чем в два раза быстрее, что это большое дело для моего огромного дерева!

onCreateLi: function(node, $li) { 
     var a = $li.find('span')[0]; 
     a.outerHTML = '<a href="' + node.href + '">' + a.outerHTML + '</a>'; 
     }