script.aculo.us 排序树选项

用户应该能够通过拖放来重新排序元素（例如列表中的项目）。没有拖放，重新排序不是一项普通的任务，但是script.aculo.us通过Sortable类提供了开箱即用的扩展重新排序支持。

当tree选项设置为“ true”时，它可以使用可排序元素中的子元素进行排序。默认值为“假”。使其可排序的元素被传递给可排序命名空间中的create()方法。

Sortable由容器元素中的项目元素组成。当您创建一个新的Sortable时，它会负责创建相应的可拖动对象和可放置对象。

要使用script.aculo.us可排序功能，您需要加载拖放模块，这也需要效果模块。代码实现所需的预编译文件如下。

                               

        Drag and drop the elements          that are to be sorted     

       

        
• Spanish
        
• French
        
• English
        
• Russian
        
• Arab
        
• Chinese
        
• Portugese
        
• Turkish
    

  

---

输出：

执行前：

执行后：

示例 2：以下示例演示了由列表元素创建的树结构的拖放操作。

HTML

  

    
    
  
    
    
     
    
        window.onload = function() {
           Sortable.create('namelist', {
                tree: true,
                scroll: window,
                treeTag: 'ul',
                tag: 'li'
            });
        }
    
  
    
        li { cursor: move; }
    

  

    
        Drag and drop the elements 
        that are to be sorted
    
  
    
        Web Technologies
            
                PHP
                CSS
                JavaScript
            
        
  
        Computer Science
            
                Data structures
                Theory of CS
                Algorithms
            
        
  
        English
            
                Grammar
                Literature
            
        
          
        Maths
        Social studies
    

  

输出：

执行前：

执行后：