温馨提示×

js sortable有示例代码吗

js
小樊
85
2024-10-23 00:54:04
栏目: 编程语言
前端开发者测试专用服务器限时活动,0元免费领,库存有限,领完即止! 点击查看>>

当然,以下是一个简单的示例代码,演示如何使用 jQuery UI 的 Sortable 插件:

HTML 代码:

<ul id="sortable">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
  <li class="ui-state-default">Item 4</li>
  <li class="ui-state-default">Item 5</li>
</ul>

JavaScript 代码:

$(function() {
  $("#sortable").sortable({
    stop: function(event, ui) {
      console.log("停止拖动");
    }
  });
});

上述代码中,我们首先在 HTML 中定义了一个无序列表,每个列表项都有一个 class 名称 ui-state-default。然后,我们在 JavaScript 中使用 jQuery UI 的 Sortable 插件来对该列表进行排序。在 stop 方法中,我们定义了一个回调函数,当拖动停止时会被触发,并在控制台中打印一条消息。

当然,这只是一个简单的示例,Sortable 插件还有很多其他选项和方法可以使用,具体可以参考 jQuery UI 的官方文档。

亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>

推荐阅读:js sortable适合初学者吗

0