script.aculo.us 排序 onChange 选项

script.aculo.us 库是一个跨浏览器库，旨在改进网站的用户界面。 Sortable 模块可用于使任何列表可排序，允许用户根据需要的顺序拖动任何项目。

onChange选项用于指定在拖动列表中的项目期间排序顺序发生变化时调用的回调函数。顺序改变的元素将作为参数传递给函数。

句法：

{ onChange: function }

参数：此选项具有如上所述和如下所述的单个值：

• 函数：这是一个回调函数，只要元素的顺序发生变化，就会调用它。

下面的示例说明了此选项的使用。

例子：

HTML

  

  
  
  
  
  
  
  
    li {
      cursor: pointer;
      height: 30px;
      width: 100px;
      border: 1px solid;
      padding: 10px;
    }
  

  

  
    
      GeeksforGeeks
    
  
  
  
    script.aculo.us Sorting onChange Option
  
    
  
    Move the items in the list to 
    trigger the onChange callback.
  
  
  
    Element 1
    Element 2
    Element 3
    Element 4
  
  
  
    window.onload = function () {
  
      Sortable.create("list1", {
  
        // Define the function to be used
        // when the list order changes
        onChange: (elem) => {
          console.log(
            "The element that was changed was:",
            elem.textContent);
        }
      });
    };
  

  

输出：