JSTree 更换图标的方法非常简单记录一下当初学的时候被难住了

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../ClientGlobalContext.js.aspx"></script>
    <script src="jquery.jqGrid.4.3.2/js/jquery.1.7.2.min.js" type="text/javascript"></script>
    <script src="jquery.jqGrid.4.3.2/js/jquery.ui.1.7.3.custom.min.js" type="text/javascript"></script>
    <script src="scripts/json2.js" type="text/javascript"></script>
    <script src="scripts/SDK.JQuery.js" type="text/javascript"></script>
    <script type="text/javascript" src="jstree/lib/jquery.cookie.js"></script>
    <script type="text/javascript" src="jstree/lib/jquery.hotkeys.js"></script>
    <script type="text/javascript" src="jstree/jquery.jstree.js"></script>
    <script src="CRM2011Main.js" type="text/javascript"></script>
    <link href="jstree/themes/default/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="div_AgentFrame" style="width: 100%; text-align: center; display: none">
        <div style="height: 20px; width: 40px; float: right;">
            <a id="a_collapse_expand" href="#" onclick="divhide(this.title)" title="隐藏呼叫中心">
                <img id="img_collapse" width="1" height="1" class="ms-crm-ImageStrip-arrow_ribboncollapse ms-crm-MastHead-Button"
                    alt="隐藏功能区,以便仅显示选项卡名称。" src="/_imgs/imagestrips/transparent_spacer.gif" />
                <img style="display: none" id="img_expand" width="1" height="1" class="ms-crm-ImageStrip-arrow_ribbonexpand ms-crm-MastHead-Button"
                    alt="显示功能区。" src="/_imgs/imagestrips/transparent_spacer.gif" /></a>
        </div>
        <iframe id="AgentFrame" frameborder="0" scrolling="no" width="1000" height="100pz">
        </iframe>
    </div>
    <div id="dialog" title="呼叫中心" style="width: 800px; display: none;">
        <table id="ContactList">
        </table>
        <div id="ContactEmpty" style="display: none">
            没有联系人数据</div>
        <table id="AccountList">
        </table>
        <div id="AccountEmpty" style="display: none">
            没有客户数据</div>
    </div>
    <div id="divTransOut" title="转接" style="display: none;">
        <table>
            <tr>
                <td>
                    输入号码:
                </td>
                <td>
                    <input id="txtTransOutNum" type="text" />
                </td>
            </tr>
        </table>
    </div>
    <div id="divTransIvr" title="转IVR" style="display: none;">
        <table>
            <tr>
                <td>
                    转移模式:
                </td>
                <td>
                    <select id="TransType" style="width: 100px">
                        <option value="0">释放转</option>
                        <option value="1">挂起转</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    IVR接入码:
                </td>
                <td>
                    <select id="AccessCode" style="width: 100px">
                        <option value="1">报修</option>
                        <option value="2">技术咨询</option>
                    </select>
                </td>
            </tr>
        </table>
    </div>
    <div id="divTeamDialog" title="">
    </div>
    <div id="demo1" class="demo">
    </div>
    <script type="text/javascript">
        $(function () {
            $("#demo1").jstree({
                "json_data": {
                    "data": [
                {
                    "data": { title: "电缆", icon: "img/person.jpg" },
                    "metadata": { id: 23 },
                    "attr": { "icon": { "image": "sdfs.jpg"} },
                    "children": [{
                        "attr": { "id": "li.node.id1" },
                        "data": {
                            "title": "Long format demo",
                            "attr": { "href": "#" }
                        },
                        "metadata": { id: 78 }

                    }, "A Child 2"]
                },
                {
                    "attr": { "id": "li.node.id1" },
                    "data": {
                        "title": "Long format demo",
                        "attr": { "href": "#" }
                    },
                    "metadata": { id: 78 }

                },
                "Node3"
            ]
                },
                "plugins": ["themes", "json_data", "ui"],
                "themes": {
                    "theme": "default",
                    "dots": true,
                    "icons": true
                }

            }).bind("select_node.jstree", function (e, data) { alert(jQuery.data(data.rslt.obj[0]).id) });
        });
    </script>
    <a onclick="TransOutDialogOpen()">CCCCC</a>
    <div id="TeamTree">
    </div>
</body>
</html>

 

posted on 2012-08-05 01:00  HelloHongfu  阅读(2027)  评论(0编辑  收藏  举报

导航