【问题标题】:Get Checked Element in JQuery JStree在 JQuery JStree 中获取选中的元素
【发布时间】:2013-08-16 18:33:53
【问题描述】:

我创建了一个带有 JSON 对象的 Jquery jstree。我的树工作正常

创建 jstree

$("#tree").jstree({
    "json_data": {
        "data": [{
            "data": "pe_opensourcescanning",
            "id": 0,
            "pId": -1,
            "children": [{
                "data": "tags",
                "id": 30,
                "pid": 0
            }, {
                "data": "branches",
                "id": 29,
                "pid": 0
            }, {
                "data": "trunk",
                "id": 1,
                "pid": 0,
                "children": [{
                    "data": "import-export",
                    "id": 28,
                    "pid": 1
                }, {
                    "data": "custom_development",
                    "id": 12,
                    "pid": 1
                }, {
                    "data": "Connectors",
                    "id": 7,
                    "pid": 1
                }, {
                    "data": "support",
                    "id": 6,
                    "pid": 1
                }, {
                    "data": "Installation-Configuration",
                    "id": 5,
                    "pid": 1
                }, {
                    "data": "backup",
                    "id": 2,
                    "pid": 1
                }]
            }]
        }]
    },
    "plugins": ["themes", "json_data", "checkbox", "ui"]
}).bind("select_node.jstree", function (e, data) {
    alert(data.rslt.obj.data("id"));
});

现在我想要每个选中节点的“id”和“data”值。我试图写一些东西,但不幸的是这不起作用。请帮助我如何实现这一目标。

获取检查节点

$("#tree").jstree("get_checked",null,true).each(function () { 
    alert(this.data);
    alert(this.id);
});

【问题讨论】:

  • 我已经看到了。但在我的情况下,“this.id”和“this.data”即将失效。
  • 试试 console.log(this);这应该有助于为您指明正确的方向
  • @Rooster 我已经按照你的建议进行了尝试。它在控制台中给了我“
  • ”。它的含义是什么。我的代码中的问题在哪里。请帮帮我。
  • jstree 模仿复选框,除非您设置参数告诉它使用真实的复选框。也许你有。你可以试试 console.log($(this).find('input[type="checkbox"]'));如果它的长度是 1,只需从中获取 id 和数据,如果它为 0,那么您需要从与 li 元素相关的任何存储位置获取 id 和数据。
  • 标签: jquery jstree


    【解决方案1】:

    您获取检查节点的功能是正确的,问题是您的 JSON 格式不正确;在树上设置属性,所以它们不能从方法中获取。

    您必须使用属性attr 否则将不会在节点上设置任何数据,来自文档:

    attr 对象将在生成的 li 节点上显示为属性。

    代码:

    $("#tree").jstree({
        "json_data": {
            "data": [{
                "data": "pe_opensourcescanning",
                    "attr": {
                    "id": 77,
                        "pId": -1
                },
                    "children": [{
                    "data": "tags",
                        "attr": {
                        "id": 30,
                            "pid": 0
                    }
                }, {
                    "data": {
                        "title": "branches"
                    },
                        "attr": {
                        "id": 29,
                            "pid": 0
                    }
                }]
            }]
        },
            "plugins": ["themes", "json_data", "checkbox", "ui"]
    })
    
    $("#getChecked").click(function () {
        $("#tree").jstree("get_checked", null, true).each(function (i, e) {
            console.log($(this).attr("id"))
        });
    });
    

    演示:http://jsfiddle.net/IrvinDominin/RYhgD/

    文档:http://www.jstree.com/documentation/json_data

    【讨论】:

    • 非常感谢您的宝贵建议。现在问题已经解决了。
    猜你喜欢
    相关资源
    最近更新 更多
    热门标签