Extjs treepanel的ctrl、shift多选、连选功能实现

为什么80%的码农都做不了架构师？>>>   

最近需要实现一个树的多选连选功能，但发现extjs的多选模型MultiSelectionModel只提供了类似ctrl的多选功能，并没有提供shift连选的功能。 网上也没有关于实现此功能的例子，于是自己重写了onNodeClick方法，供大家参考。

// 存放第一次点击的节点id
var node1 = null;
var mst=new Ext.tree.MultiSelectionModel({

// 实现ctrl,shift多选 by menglei
onNodeClick : function(n, e) {
 // 获取该父节点下所有子节点
 var childNodes = n.parentNode.childNodes;
 if (e.shiftKey) {
  if (node1 != null) {
   var v1 = v2 = v3 = 0;
   // 获取第一次点击的节点位置
   for (var i = 0; i < childNodes.length; i++) {
    if (childNodes[i].id == node1) {
     v1 = i;
     break;
    }
   }
   // 获取按shift点击的节点位置
   for (var i = 0; i < childNodes.length; i++) {
    if (childNodes[i].id == n.attributes.id) {
     v2 = i;
     break;
    }
   }
   // alert('v1:'+v1+" v2:"+v2);
   // 反向选择
   if (v1 > v2) {
    v3 = v2;
    v2 = v1;
    v1 = v3;
   }
   // 选中当前节点
   this.select(n, e);
   // alert('v1:'+v1+" v2:"+v2);
   // 选择所选区间内节点
   for (var i = 0; i < childNodes.length; i++) {
    if (i >= v1 && i < v2 + 1) {
     this.select(childNodes[i], e,
     e.shiftKey);
    } else {
     continue;
    }
   }
  } else {
   // 选中当前节点
   this.select(n, e);
   node1 = n.attributes.id;
  }

 } else if (e.ctrlKey) {
  this.select(n, e, e.ctrlKey);
  node1 = null;
 } else {
  // 选中当前节点
  this.select(n, e);
  node1 = n.attributes.id;
 }

}
});

转载于:https://my.oschina.net/junn/blog/110417