0

したがって、JStreeを組み込み<div id="navtree">、ノードを選択すると、.ajax（）メソッドを介して<div id="tabs">ページ上の別の場所にコンテンツをロードします。

$("#navtree")
  .jstree({
  "core" : { "animation" : 0 },
  "themes" : { "theme" : "classic", "dots" : true, "icons" : false },
  "ui" : { "select_limit" : 1 },
  "plugins" : [ "themes", "html_data", "ui" ]
})

.bind("select_node.jstree", function (event, data) {
  data.inst.toggle_node(data.rslt.obj);
  $("#main").css("display","none");
  var identifier = $.trim(data.rslt.obj.children("a").text());
  $.ajax({
    data : {target : identifier},
    type : "POST",
    url : data.rslt.obj.children("a").attr("href"),
    success : function(response) {
      $("#tabs").html(response);
      $("#tabs").tabs();
      $("#main").css("display","inline");
    }
  });
  $("#searchinput").val("") .focus();
  return false;
});

これはすべて美しく機能します。

<a class="searchlink">この新しくロードされたコンテンツには、クリックしたときにプログラムでjstreeに戻ってノードを選択したいタグがいくつか含まれています。

.on（）メソッドを使用すると、これらの<a class="searchlink">タグをクリックしたときにアラートを発生させることができます。

$("body").on("click", "a.searchlink", function(event) {
  event.preventDefault();
  var $nodeid = "#" + $(this).text().replace(/\./g, "_");
  alert($nodeid);
  $("#navtree").jstree("select_node", $nodeid);
  //$(nodeid).trigger("select_node.jstree");
});

.on（）はページに追加される将来のすべての要素に伝播するため、alert（）は選択したいノードの正しいIDを表示します。

ただし、どのように実行しようとしても（そして、考えられるすべてのことを実行してみました）、既存のjstreeのノードで「select_node」イベントを発生させることはできません。これらの<a class="searchlink">タグは、jstreeがインスタンス化されてからずっと後に.ajax（）呼び出しを介してページに追加されたという事実と関係があります。

新しい情報：

<a class="searchlink">Firefox Web開発者コンソールでは、 .ajax（）を介してロードさ れたをクリックするたびに、「$（ "＃navtree"）。jstreeは関数ではありません」というエラーが表示されます。

4

1 に答える 1

1

ツリー上のノードをクリックして同じ画面に div を設定しようとしたときに、「$("#sometree").jstree は関数ではありません」という同様のエラーが発生しました。divにロードされたページがjqueryを再度ロードしていたため、この奇妙な問題が発生していたことが判明しました。ajax 経由でロードしたコンテンツに、jquery を再度ロードするディレクティブがあるかどうかを確認します。

于 2013-06-10T17:43:49.567 に答える