zTree默认选中指定节点并执行事件

Posted 2020-08-04 SKYisLimit

var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
var node = treeObj.getNodeByParam("id", "370000");
treeObj.selectNode(node);
setting.callback.onClick = onClick;

//要执行的方法
function onClick() {......}



方法二：

var zTree;
    var demoIframe;

    var setting = {
        view: {
            dblClickExpand: false,
            showLine: true,
            selectedMulti: false
        },
        data: {
            simpleData: {
                enable:true,
                idKey: "id",
                pIdKey: "pId",
                rootPId: ""
            }
        },
        callback: {
            beforeClick: function(treeId, treeNode) {
                var zTree = $.fn.zTree.getZTreeObj("tree");
                if (treeNode.isParent) {
                    zTree.expandNode(treeNode);
                    return false;
                } else {
                    demoIframe.attr("src",treeNode.file + ".html");
                    return true;
                }
            }
        }
    };

var zNodes = [
        {id:1, pId:0, name:"[core] Basic Functions", open:false},
        {id:101, pId:1, name:"Standard JSON Data", file:"core/standardData"},
        {id:102, pId:1, name:"Simple JSON Data", file:"core/simpleData"}];

    $(document).ready(function(){
        var t = $("#tree");
        t = $.fn.zTree.init(t, setting, zNodes);
        demoIframe = $("#testIframe");
        demoIframe.bind("load", loadReady);
        var zTree = $.fn.zTree.getZTreeObj("tree");

//下面这段可以放在其他地方，比如配合搜索功能使用，搜索到节点ID然后触发点击事件
        var treeNode=zTree.getNodeByParam("id", 301)
        zTree.selectNode(treeNode);
        if (treeNode.isParent) {
            zTree.expandNode(treeNode);
             
        } else {
            demoIframe.attr("src",treeNode.file + ".html");
             
        }
    
    });


<TABLE border=0 height=600px align=left>
    <TR>
        <TD width=260px align=left valign=top style="BORDER-RIGHT: #999999 1px dashed">
            <ul id="tree" class="ztree" style="width:260px; overflow:auto;"></ul>
        </TD>
        <TD width=770px align=left valign=top><IFRAME ID="testIframe" Name="testIframe" FRAMEBORDER=0 SCROLLING=AUTO width=100%  height=600px SRC="core/standardData.html"></IFRAME></TD>
    </TR>
</TABLE>