在DHTMLX树结构中覆盖OOTB上下导航功能?

时间:2015-09-15 17:20:38

标签: javascript jquery dhtmlx

如何覆盖OOTB键和按键功能。目前在OOTB导航工作正常,当我们按Enter键导航到所需的选择后,它显示相应的树项目详细信息。但我一直在尝试的是,细节应该只在不按Enter键的情况下在向上和向下导航中显示。

以前这是代码。

 tree.attachEvent('onKeyPress', function(key, event){
            if((tree._selected).length > 0){
                var xKey = 88, vKey = 86, cKey = 67, delKey = 46, escKey = 27,enterKey = 13,i, treeId, selectedNodeId, selectedNodeIds=[];
                if(event.ctrlKey && (key==cKey)) {
                    pubsub.publish('copyTree' + index);
                }   
                else if(event.ctrlKey && (key==vKey)){
                    pubsub.publish('pasteTree' + index);
                }   
                else if(event.ctrlKey && (key==xKey)){
                    pubsub.publish('cutTree' + index);
                }
                else if(key==delKey){
                    pubsub.publish('deleteTree' + index, 'delete');
                }else if(key==escKey){
                    tree.clearCut();
                    cutCopyManager.clear();
                }else if(key==enterKey){
                    if(tree._selected && tree._selected.length>0){
                        treeId = (tree._selected)[0].id;
                        showProductDetails(treeId);
                    }
                }
                else{
                     return true;
                }
            }
        });

我修改过这种方式

tree.attachEvent('onKeyPress', function(key, event){
            if((tree._selected).length > 0){
                var xKey = 88, vKey = 86, cKey = 67, delKey = 46, escKey = 27,enterKey = 13,downKey = 40,upKey = 38,
                    i, treeId, selectedNodeId, selectedNodeIds=[];
                if(event.ctrlKey && (key==cKey)) {
                    pubsub.publish('copyTree' + index);
                }   
                else if(event.ctrlKey && (key==vKey)){
                    pubsub.publish('pasteTree' + index);
                }   
                else if(event.ctrlKey && (key==xKey)){
                    pubsub.publish('cutTree' + index);
                }
                else if(key==delKey){
                    pubsub.publish('deleteTree' + index, 'delete');
                }else if(key==escKey){
                    tree.clearCut();
                    cutCopyManager.clear();
                }else if(key==enterKey){
                    if(tree._selected && tree._selected.length>0){
                        treeId = (tree._selected)[0].id;
                        showProductDetails(treeId);
                    }
                }
                else if(key==upKey){
                    if(tree._selected && tree._selected.length>0){
                        treeId = (tree._selected)[0].id;
                        showProductDetails(treeId);
                    }
                }
                else if(key==downKey){
                    if(tree._selected && tree._selected.length>0){
                        treeId = (tree._selected)[0].id;
                        showProductDetails(treeId);
                    }
                }
                else{
                     return true;
                }
            }
        });

但是它的选择现在已经消失了。试着从2天开始调试这个。有人可以告诉我有什么问题吗?

1 个答案:

答案 0 :(得分:0)

我通过一些研究发现了自己。我们实际上可以通过递增或递减索引来遍历树。

else if(key==40 || key==38){
    if(tree._selected && tree._selected.length>0){
      treeId = (tree._selected)[0].id;
      indexid = tree.getIndexById(treeId);
       if(key==40){
        tempId = tree.getRootNode().id;
        indexid = indexid + 1;
        treeId = tree.getItemIdByIndex(tempId,indexid);
        showProductDetails(treeId);
       }else if(key==38){
        tempId = tree.getRootNode().id;
        indexid = indexid - 1;
        treeId = tree.getItemIdByIndex(tempId,indexid);
        showProductDetails(treeId);
    }
}
return true;
}