jquery 树事件无效

Question

我已经初始化 jQuery EasyUI 的树并单击它没有提醒我的节点。这是我的 html 代码

<body>
<ul id="tt" class="easyui-tree"
            url="tree_data.json"
            checkbox="true">
</ul>
</body>

我的 javascript 在这里

<head>
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<script>
$('#tt').tree({
    onClick: function(node){
        alert(node.text);  // alert node text property when clicked
    }
});
</script>
</head>

我在jquery.com上看到的示例和演示就是这样。为什么它不起作用？

Answer 1

您应该将 js 放在 $(document).ready() 中，如下所示。希望对您有所帮助。

$(document).ready(function () {
      $('#tt').tree({
           onClick: function (node) {
                alert(node.text);  
           }
      });
});

完整代码

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
        <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
        <script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
        <script>
            $(document).ready(function () {
                $('#tt').tree({
                    data: [{
                        "id": 1,
                        "text": "Folder1",
                        "iconCls": "icon-save",
                        "children": [{
                        "text": "File1",
                        "checked": true
                        }, {
                        "text": "Books",
                        "state": "open",
                        "attributes": {
                            "url": "/demo/book/abc",
                            "price": 100
                        },
                        "children": [{
                            "text": "PhotoShop",
                            "checked": true
                        }, {
                            "id": 8,
                            "text": "Sub Bookds",
                            "state": "closed"
                        }]
                    }]
                    }, {
                        "text": "Languages",
                        "state": "closed",
                        "children": [{
                        "text": "Java"
                    }, {
                        "text": "C#"
                    }]
                }],

                onClick: function (node) {
                    alert(node.text);
                }
                });
            });
        </script>
    </head>

    <body>
        <ul id="tt" class="easyui-tree" checkbox="true"></ul>
    </body>
</html>

jquery 树事件无效

jquery tree events didn't work

javascript

jquery

jquery-easyui