2 つの zTree はどのように相互作用するのでしょうか?-jsチュートリアル-php.cn

2 つの zTree はどのように相互作用するのでしょうか?

php中世界最好的语言

リリース： 2018-03-15 14:56:59

オリジナル

2127 人が閲覧しました

今回は 2 つの zTree を相互にリンクする方法を説明します。 2 つの zTree を相互にリンクするための注意事項は何ですか? ここでは実際のケースを示しますので、一緒に見てみましょう。

はじめに

zTreeは、JQueryのコアコードを使用して、最も一般的な機能を実行できる一連のTreeプラグインを実装します

IE、FireFox、Chromeおよびその他のブラウザと互換性があります
ページ内で複数のツリーインスタンスを同時に生成可能
JSONデータをサポート
ワンタイム静的生成とAjax非同期読み込みをサポート
複数のイベント応答とフィードバックをサポート
ツリーをサポートノードの移動、編集、
削除
スキン/パーソナライズされたアイコンの変更をサポート(CSSに依存)
非常に柔軟なチェックボックスまたはラジオ選択機能をサポート
柔軟性と変更機能を実現するためのシンプルなパラメータ設定

はじめに

今日開発をしていたとき、要件により、同じページの左側と右側に2つのツリーを実装する必要がありました。特定のツリーのノードが選択されると、対応するノードが選択されます。他のツリーも選択されます。 (2 つのツリーは関連しています。もちろん、必要に応じてリンク条件や方法を変更できます)。

ここでは実装ツリーのコードは貼り付けず、リンクを実現する方法のみを示します。

効果は図に示すとおりです:

効果の画像

コード:

function linkageTreeClick(event, treeId, treeNode) {
  var param = treeNode.id; //获得点击树的ID
  var otherTree = $.fn.zTree.getZTreeObj(treeId);
  // 选取树的所有节点
  var nodes = otherTree.getNodesByParam(param);
  //遍历树的节点
  for (var i in nodes) {
   if(param==nodes[i].id){
    otherTree.selectNode(nodes[i]);
    return;
   }
  }
 }

ログイン後にコピー

ここで、treeId はリンクするツリーの ID です。

でこのメソッドを呼び出します。 zTreeのonclickメソッドに必要なパラメータを渡して連携を実装します。

メソッド

パラメータはツリーのノードであり、その機能はノードを選択させることです。 selectNode()

この記事の事例を読んだ後、あなたはその方法をマスターしたと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

webpack を使用して jquery 環境設定を記述する方法

jQuery の Validate プラグインが入力値を検証する方法

Ajax がバックグラウンドデータを要求した後に反映されない場合の対処方法成功しました

jQuery EasyUI折りたたみパネルの使用

以上が2 つの zTree はどのように相互作用するのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。