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

       最近需要实现一个树的多选连选功能,但发现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;
	}

}
})



评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值