changed.jstree事件在类方法的jstree中不起作用

时间:2016-12-30 10:49:36

标签: javascript jquery jstree

我正在使用jstree复选框插件,我希望获得复选框项目的已选中和未选中状态。 changed.jstree事件在_setEvents()方法中不起作用。但是当我在_setTree()方法中添加事件时它工作正常。我需要在_setEvents()方法中获取事件触发器。

这是我正在使用的代码:

  export default class Test {
  constructor(container) {
    this._tab = null;
    this._container = container;
    this._setEvents();
  }

  get tab() {
    return this._tab;
  }  

  show(data) {
    this._data = data;   
    this._setTree();    

    return this;
  }  


  _setEvents() {
    const self = this;

    $(document)   

      .on('click', '#js-image-container', () => {
        $('#js-image-uploader').trigger('click');
      });
      $('#js-categories-container').on('changed.jstree', () => this._handleSelection());//this wont work

    return this;
  }


  _setTree() {
    $('#js-categories-container').jstree(jsonTreeGenerator.generate(this._data.categories));
    $('#js-categories-container').on('changed.jstree', () => this._handleSelection()); //this will work
    return this;
  }
  _handleSelection() {
   alert(1);
  }
}

1 个答案:

答案 0 :(得分:0)

由于您要动态添加js-categories-container元素,我相信当您将事件绑定到它时它还没有。所以你必须委托事件处理,例如与js-image-container元素相同。查看演示 - Fiddle Demo

$(document).on('click', '#js-image-container', 
    () => { $('#js-image-uploader').trigger('click'); }
);

$(document).on("click", '#js-categories-container', 
    () => {
       // get the node if you need it
       var node = $('#js-categories-container').jstree().get_node(event.target); 
       // do something
       this._handleSelection();
    }
);