2012-06-17 2 views
0

Windows에서 explorer.exe와 같이 작동하고 싶습니다. 붙여 넣기 항목이 표시 될 요소를 잘라내거나 복사 한 경우에만 가능합니다.이 작업은 가끔씩 작동하지만 아마도 누락 된 것이 있습니다. if if 그것이 항상 당신의 생각을 알고 행복하게 일할 수 있도록 개선하는 방법이 있습니다.jstree 사용자 정의 컨텍스트 메뉴에 대한 다음 논리가 올바르게 작동하는지 확인하는 방법은 무엇입니까?

  jQuery.noConflict(); 

     jQuery(document).ready(function ($) { 
     // This is for the context menu to bind with operations on the right clicked node 
       function customMenu(node) { 
      // The default set of all items 

     var control; 

      var items = { 

         createItem: { 
        label: "Create", 
        action: function (node) { return {createItem: this.create(node) }; } 
       }, 

         renameItem: { 
        label: "Rename", 
        action: function (node) { return {renameItem: this.rename(node) }; } 
       }, 

        deleteItem: { 
        label: "Delete", 
        action: function (node) {  return {deleteItem: this.remove(node) }; }, 
        "separator_after": true 

       }, 
         copyItem: { 
           label: "Copy", 
           action: function (node) { $(node).addClass("copy"); return {copyItem: this.copy(node) }; } 
       }, 
           cutItem: { 
           label: "Cut", 
           action: function (node) { $(node).addClass("cut"); return {cutItem: this.cut(node) }; } 
       }, 
         pasteItem: { 
           label: "Paste", 
           action: function (node) { $(node).addClass("paste"); return {pasteItem: this.paste(node) }; } 
       } 


      }; 


      // We go over all the selected items as the context menu only takes action on the one that is right clicked 
       $.jstree._reference("#{$id_arr[$k]}").get_selected(false, true).each(function(index,element){ 

         if ($(element).attr("id") != $(node).attr("id")) 
         { 
          // Let's deselect all nodes that are unrelated to the context menu -- selected but are not the one right clicked 

          $("#{$id_arr[$k]}").jstree("deselect_node", '#'+$(element).attr("id")); 
         } 
        }); 



      // Let's loop through all elements and try to find if the paste operation was done already  
      $("#{$id_arr[$k]}").find("li").each(function(index,element){   

      if($(node).hasClass("paste")) 
      { 
       //We are asumming that the current event is pasted so remove the Paste from the context menu 
       control =0; 
       // and from any node that has the class for cut or copy.. there is no other way as dnd, move and copy, cut are a move operation for jstree 
        if($(element).hasClass("copy")) $(element).removeClass("copy"); 
        if ($(element).hasClass("cut")) $(element).removeClass("cut"); 
      } 
      if(($(element).hasClass("copy") || $(element).hasClass("cut")) ) 
      { 
      control =1; 
      } 

      //we already pasted the node 
      if($(element).hasClass("paste")) 
      { 
      $(this).removeClass("paste"); 
      } 

      }); 


       switch (control) 
       { 
       case 1: 
            switch ($(node).attr("rel")) 
               { 

                 case "drive": 
                  delete items.renameItem; 
                  delete items.deleteItem; 
                  delete items.cutItem; 
                  delete items.copyItem; 
                 break; 

               } 
        break; 


       case 0: 
               switch ($(node).attr("rel")) 
                 { 

                   case "drive": 
                    delete items.renameItem; 
                    delete items.deleteItem; 
                    delete items.cutItem; 
                    delete items.copyItem; 
                   delete items.pasteItem; 
                   break; 

                   case "default": 
                   delete items.pasteItem; 
                   break; 

                 } 
       break; 

       default:    switch ($(node).attr("rel")) 
                 { 

                   case "drive": 
                    delete items.renameItem; 
                    delete items.deleteItem; 
                    delete items.cutItem; 
                    delete items.copyItem; 
                   delete items.pasteItem; 
                   break; 

                   case "default": 
                   delete items.pasteItem; 
                   break; 

                 } 

       break; 

        } 



      return items; 

     } 

답변

0

분명히이 기능이 작동하지만 모든 경우에 사용할 수 있습니까? 잘라 내기 또는 붙여 넣기가 현재 노드 인 경우 붙여 넣기 옵션을 표시하지 않고 다른 노드에만 표시하려는 것입니다. 누군가가 모양을 취할 수 있거나 다른 사람에게 도움을 줄 수 있기를 바랍니다. 바인딩없이보고하는 동일한 기능 :

   <div id="$id_arr[$k]" class="jstree_container"></div> 
     </div> 
     </li> 

     <!-- JavaScript neccessary for this tree : {$value} --> 
     <script type="text/javascript" > 
      jQuery.noConflict(); 

     jQuery(function ($) { 

     // This is for the context menu to bind with operations on the right clicked node 
       function customMenu(node) { 
      // The default set of all items 

     var control; 

      var items = { 

         createItem: { 
        label: "Create", 
        action: function (node) { return {createItem: this.create(node) }; } 
       }, 

         renameItem: { 
        label: "Rename", 
        action: function (node) { return {renameItem: this.rename(node) }; } 
       }, 

        deleteItem: { 
        label: "Delete", 
        action: function (node) {  return {deleteItem: this.remove(node) }; }, 
        "separator_after": true 

       }, 
         copyItem: { 
           label: "Copy", 
           action: function (node) { $(node).addClass("copy"); return {copyItem: this.copy(node) }; } 
       }, 
           cutItem: { 
           label: "Cut", 
           action: function (node) { $(node).addClass("cut"); return {cutItem: this.cut(node) }; } 
       }, 
         pasteItem: { 
           label: "Paste", 
           action: function (node) { $(node).addClass("paste"); return {pasteItem: this.paste(node) }; } 
       } 


      }; 


      // We go over all the selected items as the context menu only takes action on the one that is right clicked 
       $.jstree._reference("#{$id_arr[$k]}").get_selected(false, true).each(function(index,element) 
       { 

         if ($(element).attr("id") != $(node).attr("id")) 
         { 
          // Let's deselect all nodes that are unrelated to the context menu -- selected but are not the one right clicked 

          $("#{$id_arr[$k]}").jstree("deselect_node", '#'+$(element).attr("id")); 
         } 
        }); 




     //if any previous click has the class for copy or cut 
      $("#{$id_arr[$k]}").find("li").each(function(index,element)   
      { 
         if ($(element) != $(node)) 
        { 
         if( $(element).hasClass("copy") || $(element).hasClass("cut")) control=1; 
        } 
        else if( $(node).hasClass("cut") || $(node).hasClass("copy")) 
         { 
         control=0; 
         } 
      }); 


      //only remove the class for cut or copy if the current operation is to paste 
     if($(node).hasClass("paste")) 
     { 
      control=0; 
      // Let's loop through all elements and try to find if the paste operation was done already  
      $("#{$id_arr[$k]}").find("li").each(function(index,element) 
      {  
       if($(element).hasClass("copy")) $(this).removeClass("copy"); 
        if ($(element).hasClass("cut")) $(this).removeClass("cut"); 
        if ($(element).hasClass("paste")) $(this).removeClass("paste"); 
       }); 
     } 


       switch (control) 
       { 
       //Remove the paste item from the context menu 
       case 0: 
           switch ($(node).attr("rel")) 
            { 

              case "drive": 
               delete items.renameItem; 
               delete items.deleteItem; 
               delete items.cutItem; 
               delete items.copyItem; 
              delete items.pasteItem; 
              break; 

              case "default": 
              delete items.pasteItem; 
              break; 

            } 
       break; 

       //Remove the paste item from the context menu only on the node that has either copy or cut added class 
         case 1: 
         if($(node).hasClass("cut") || $(node).hasClass("copy")) 
         { 
               switch ($(node).attr("rel")) 
               { 

                   case "drive": 
                    delete items.renameItem; 
                    delete items.deleteItem; 
                    delete items.cutItem; 
                    delete items.copyItem; 
                   delete items.pasteItem; 
                   break; 

                   case "default": 
                   delete items.pasteItem; 
                   break; 


               } 
             } 
              else //Re-enable it on the clicked node that does not have the cut or copy class 
               { 
            switch ($(node).attr("rel")) 
               { 

                 case "drive": 
                  delete items.renameItem; 
                  delete items.deleteItem; 
                  delete items.cutItem; 
                  delete items.copyItem; 
                 break; 

               }  
              } 

        break; 

       //initial state don't show the paste option on any node 
       default:    switch ($(node).attr("rel")) 
                 { 

                   case "drive": 
                    delete items.renameItem; 
                    delete items.deleteItem; 
                    delete items.cutItem; 
                    delete items.copyItem; 
                    delete items.pasteItem; 
                   break; 

                   case "default": 
                   delete items.pasteItem; 
                   break; 

                 } 

       break; 

        } 

      return items; 

     } 




     $("#{$id_arr[$k]}").jstree({ 


       // List of active plugins used 
       "plugins" : [ "themes","json_data", "ui", "crrm" , "hotkeys" , "types" , "dnd", "contextmenu"], 

       "contextmenu" : { "items" : customMenu , "select_node": true}, 
관련 문제