jstreeでハイライトされている文字列を取得したい

このサイトのソースコードです。

html
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta http-equiv="X-UA-Compatible" content="IE=edge">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>Document</title>
8    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
9</head>
10<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.2/themes/default/style.min.css">
11<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.2/jstree.min.js"></script>
12<body>
13    <div id="tree1">
14        <ul>
15            <li>demo</li>
16                <li>dist
17                    <ul>
18                        <li>themes</li>
19                        <li>jstree.js</li>
20                        <li>jstree.min.js</li>
21                    </ul>
22                </li>
23            <li>src</li>
24            <li>test</li>
25            <li>LICENCE-MIT</li>
26        </ul>
27    </div>
28    <script>
29        $(function(){$('#tree1').jstree();});
30    </script>
31</body>
32</html>

このHTMLを開くと下の画像が表示されて、CTRLボタンを押しながら複数選択できるのですが、この値を取得する方法が知りたいです。

行動規範の内容に同意します

回答1件

ベストアンサー

公式サイトにサンプルがありました。以下のような感じで取得できるようです。

■ jsTree - Listening for events
https://www.jstree.com/docs/events/

javascript
1$(function(){
2    $('#tree1')
3        .on('changed.jstree', function (e, data) {
4            var i, j, r = [];
5            for(i = 0, j = data.selected.length; i < j; i++) {
6                r.push(data.instance.get_node(data.selected[i]).text);
7            }
8            console.log('Selected: ' + r.join(', '));
9        })
10    .jstree();
11});
12