1. ホーム
  2. Web制作
  3. html5

amazeuiのツリーノード自動展開パネルの実装と、最初のツリーノードの選択

2022-01-11 06:06:24

適用対象:amazeui.tree バージョン:不明(2018年10月現在)

Amaze UI TreeはAmazeフレームワークの拡張機能で、メリットはスタイルがAmazeフレームワークと統一されていること、デメリットは非常に不完全なこと、プロジェクトで適用できるようにするために、そのコアコードを修正しました(ここではなく、別の記事で公開します)。選択されたツリーノード関数のAPIは、繰り返し試したが失敗し、単に1つを書き直した。次のようになります。

  //Expand collapse panel by default
                  $("#user-nav").collapse('open');
                   //default click the first button
                   var btnArray = $(".am-tree-branch-name.click-item");
                   btnArray.each(function(i){
                       //console.log($(this).html());
                       if ( i == 1 ) {
                           $(this).click(function(){
                                $(".click-item").removeClass("am-tree-icon");
                                 $(".click-item").removeClass("am-icon-check");
                                 
                                 $(this).addClass("am-tree-icon");
                                 $(this).addClass("am-icon-check");
                                 
                                 var obj = new Object();
                                 obj.title = $(this).attr("data.title");
                                 obj.level = $(this).attr("data.level"); 
                                 $(this).trigger('tree-click', {
                                       data: obj
                                  });
                           });
                           $(this).trigger('click');
                       }
                   });


この記事は、amazeuiのツリーノードが自動的に折りたたまれたパネルを展開し、最初のツリーノードを選択することを紹介し、より関連amazeuiツリーノードの内容は、スクリプトハウスの過去の記事を検索するか、次の関連記事を閲覧を続けてください、私はあなたが将来的にもっとスクリプトハウスをサポートして願っています!。