如何更換圖像？

Question

下面的代碼顯示了樹結構。當我點擊圖片Pic.gif時，它必須被新圖片取代。類似pic1.gif到新圖片，pic6.gif到新圖片。可以幫助mw與代碼它在哪裏適合這個代碼？

var children = [{ 
    text: 'family', 
    icon: 'pic1.gif', 
    children: [{ 
     text: 'parent1', 
     icon: 'pic2.gif', 
     children: [{ 
      icon: 'pic3.gif', 
      text: 'children1', 
      leaf: true}, 
     { 
      icon: 'pic4.gif', 
      text: 'children2', 
      leaf: true}, 
     { 
      icon: 'pic5.gif', 
      text: 'children3', 
      leaf: true}]}], 

    }, 
{ 
    text: 'Parent2', 
    icon: 'pic6.gif', 
    children: [{ 
     icon: 'pic7.gif', 
     text: 'children4', 
     leaf: true}, 
    { 
     icon: 'pic8.gif', 
     text: 'children5', 
     leaf: true}, 
    { 
     icon: 'pic9.gif', 
     text: "children6", 
     leaf: true}]}]; 
Ext.onReady(function() { 
    var tree = new Ext.tree.TreePanel({ 
     loader: new Ext.tree.TreeLoader(), 
     width: 1000, 
     height: 1000, 
     renderTo: Ext.getBody(), 
     root: new Ext.tree.AsyncTreeNode({ 
      expanded: false, 
      leaf: false, 
      icon: 'pic.gif' 

      , 
      text: 'Head', 
      children: children 
     }) 
    }); 
}); 

Answer 1

你需要當節點使用beforeexpand聽者擴大到觸發圖標變化：

var children = [{ 
    text: 'family', 
    icon: 'pic1.gif', 
    listeners: { 
     'beforeexpand': function(node) { 
      node.setIcon('newImage.gif'); 
     } 
    } 
    children: [{ 
    //... 

您可以重複您的其他節點也。