JsTree 选择被逆转

Question

所以我的问题是，基本上，我在 JsTree 中设置了一些节点，它在我的页面上已有的一棵树上工作，但那些动态加载的节点只会恢复选择。这意味着它们确实按预期被选中，但之后由于某种原因被取消选择。

选择代码：

selected.forEach(function(element,index,array){
    if(element !== null)
        $(value).parent().find(".filter-value-tree").jstree("select_node", "#"+element);
});

和jquery-2.1.1.js中的代码行：

return typeof n !== U && n.event.triggered !== b.type ? n.event.dispatch.apply(a, arguments) : void 0

在该特定行之前，节点已按预期选择。

显示我正在尝试做的事情的基础知识的片段（它现在似乎重现了问题）：

$("#testBtn").on("click", function() {
  loadTree(getValueTree);


  $("#filter-value-tree").jstree("select_node", "#2");
});

function loadTree(callback){
  //Normally there would be a ajax request here, to be used with differenct callback functions
  var response = '<li id="1">Information</li><li id="2">Service</li><li id="3">Claim</li><li id="4">Education</li>';
  
  setTimeout(function(){
    callback(response);
  }, 1000);
}

function getValueTree(result){
    $("#testDiv").append("<div id='filter-value-tree'><ul><li id='1'>Test1</li><li id='2'>Test2</li></ul></div>");

    $("#filter-value-tree").find("ul").append(result);

    $("#filter-value-tree").jstree({
        'core' : {
            'check_callback': true,
            'multiple': true
        },
        "plugins" : [ "changed" ]
    });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />

<button type="button" id="testBtn">Test</button>

<div id="testDiv"></div>

为了结束它，提供更多信息，我正在从我的 mysql 数据库的 php 页面中使用 AJAX 加载 jstree 的内容。 ajax 调用设置为 async: false，就好像有人想知道它是否可能那样。加载按预期工作，我只想说节点正在被选中，但在一段时间后才被取消选中（如果我在 jquery-2.1.1.js 的那一行逐步调试，所以调试器完成之前的最后一件事）。

希望你能帮助我，在此先感谢。

Answer 1

您遇到的问题与synchronous/asynchronous代码有关：

在此代码中：

loadTree(getValueTree);
$("#filter-value-tree").jstree("select_node", "#2");

...最后一条语句被执行 before getValueTree 被调用。这是因为 loadTree 将执行 Ajax 调用，但会立即 return 而不调用回调。仅当响应将通过异步事件传入时才调用回调。在您当前的代码完成运行（即清空调用堆栈）之前，永远不会处理此事件。只有这样队列中的事件才会被处理。

为了解决这个问题，将该语句移到回调部分，例如，如下所示：

loadTree(function () {
    getValueTree();
    $("#filter-value-tree").jstree("select_node", "#2"); 
});

JsTree 选择被逆转

JsTree Selection is getting reversed

javascript

ajax

jquery

jstree