jsTreeでは、ノードのテキストをクリック可能にするにはどうすればいいですか（チェックボックスのチェック）

Question

チェックボックスの横にあるノードのテキストをクリックすると、チェックボックスをオンにします。通常これは<label for="whatever"></label>で行われます。しかし、jsTreeは実際のチェックボックスを使用していないので、どうすればよいでしょうか？

$('#mytree').jstree({'plugins':['checkbox']})でツリーを作成すると、末尾に.delegate("a", "click", function (event, data) { $(event.target).find('.jstree-checkbox').click() })と入力すると機能します。しかし、目に見える遅れがあります。

私は疑問を提起します。対応するテキストをクリックすると、ボックスをチェックする最も良い方法は何ですか？

Answer 1

私は使用しているクリックハンドリング技術に同意します。私は言及された遅れを見ないが、それは私がサーバーに何かをポストしていないからかもしれない。

チェックボックスが純粋にビジュアルの場合、おそらくクラスを直接変更することができます。これは、別のクリックイベントを投げるよりも速くなければなりません。

$(event.target).parent("li:first").toggleClass("jstree-unchecked").toggleClass("jstree-checked"); 

Answer 2

jstreeのチェックボックスプラグインは、ノードのチェック/チェックを外すときに他の操作を実行するように見えます。私はあなたのアプローチは、大幅な遅延につながった理由は、あなたがすべての単一<a/>にclickイベントを結合しなければならない可能性が信じて、サイドノートでは

$(function(){ 
    // Initialize jstree 
    var $tree = $('.tree-target').jstree({ 
     "plugins": ["checkbox"] 
    }); 

    // Bind an event to the anchor tag within each tree entry 
    // Note: '.on' is used here as this will ensure that any 
    // dynamically-generated entries will also use this 'click' 
    // event. 
    $tree.on('click', 'li.tree > a', function (e) { 
     e.stopPropagation(); 

     // Find the first parent 'tree' element 
     var $node = $(this).parents('li.tree').eq(0); 

     // Toggle the state of the current 'tree' element 
     // Note: The third parameter (in this case 'toggle') 
     // can be any value other than true or false 
     $tree.jstree('change_state', $node, 'toggle'); 
     return false; 
    }); 
});​ 

：私は次のようにあなたが探している何をすべきと考えていますタグを追加します。これは、適切なイベントターゲットを見つけようとすると、かなりのオーバーヘッドにつながります。