.load與jsTree

Question

我正在幫助朋友嘗試設置jsTree。我們試圖在點擊一個節點時將頁面加載到另一個div中。然而，一切似乎都在工作，但.load由於某種原因不會啓動。我用alert來檢查thisItem，它被定義並且是正確的變量。

$(function() { 

    $('.tree').jstree().delegate("a", "click", function(event, data){ 
     event.preventDefault(); 
     var thisItem = $(this).attr('id'); 
     thisItem += ".html"; 
     alert(thisItem); 
     $('.table').load(thisItem); 
     }); 

}); 

這是HTML：

<div class = "tree"> 
    <ul> 
    <li id = "1"><a href = "" id = "1">Test 1</a> 
     <ul> 
     <li id = "2"><a href = "" id = "2">Test 2</a></li> 
     </ul> 
    </li> 
    </ul> 
</div> 
<div class = "table"> 
</div> 

我有將對應於這些ID，我要加載到table頁。這工作沒有與常規.click jstree ...但我想用它與jstree。

我只是不知道爲什麼它不會加載頁面時使用jstree ...但它會工作時，我不使用jstree。我甚至試圖在.tree li之外做一個.click jstree以外的東西，但是這也不起作用。 （如果我得到這個代碼在這裏擺脫jstree東西都在一起工作。）

$('.tree li').click(function() { 
     var thisItem = $(this).attr('id'); 
     thisItem += ".html"; 
     $('.table').load(thisItem); 
    }); 

注意：這僅僅是一個更有活力的一塊項目的測試。

Answer 1

您可以結合自定義事件（some-event.jstree）到jstree元素執行自己的代碼，你在這種情況下，尋找一個爲select_node.jstree：

$('.tree').bind("select_node.jstree", function (e, data) { 
    var $obj = data.rslt.obj; // this will be a jquery object representing the <li> you've clicked 
    var url = $obj.attr("id") + ".html"; 
    $('.table').load(url); 
}); 

有關信息傳遞給了data對象回調函數（從jstree documentation）：

{ 
    "inst" : /* the actual tree instance */, 
    "args" : /* arguments passed to the function */, 
    "rslt" : /* any data the function passed to the event */, 
    "rlbk" : /* an optional rollback object - it is not always present */ 
} 

希望這會有所幫助。

Answer 2

看看這裏的第一個演示：http://www.jstree.com/documentation/core#demos

，因爲我相信，因爲他們使用自己的自定義事件插件本身解除綁定單擊處理你的點擊處理程序不工作。您可以通過他們在第一個演示中所用的相同方法將這些事件綁定到這些事件中

$("#demo1").jstree("toggle_node","#phtml_1"); 
$("#demo1").bind("open_node.jstree close_node.jstree", function (e) { 
    //Stuff 
}); 

事件似乎也遵循形式 「功能 .jstree」。因此open_node.jstree事件在open_node函數發生後被觸發。您可以在上面的同一鏈接中找到功能列表。