jQuery UI 的 Sortable 组件提供了一个 receive 事件,该事件在可排序元素被拖动到另一个可排序元素中时触发。在本教程中,我们将详细介绍 Sortable 的 receive 事件的使用。
事件基本语如下:
$( ".selector" ).sortable({
receive: function( event, ui ) {}
});
其中,".selector" 是 Sortable 的 CSS 选择器。
以下两个示例:
示例一:使用 Sortable 的 receive 事件
$( "#my-sort" ).sortable({
receive:( event, ui ) {
console.log( "Sortable element received a new item" );
}
});
这将创建一个名为 my-sortable 的 Sortable 实例,并将元素拖动到该实例中时触发 receive 事件。在事件处理程序中,将消息“Sortable element received a new item”记录到控制台。
示例二:使用 Sortable 的 receive 事件和 CSS 类
$( "#my-sortable" ).sortable({
receive function( event, ui ) {
$( ui.item ).addClass( "new-item" );
}
});
这将创建一个名为 my-sortable 的 Sortable 实例,并在将元素拖动到该实例中时触发 receive 事件。在事件处理程序中,使用 addClass() 方法将 CSS 类“new-item”添加到新添加的元素。
总结:
jQuery UI 的 Sortable 组件提供了一个 receive 事件,该事件在可排序元素被拖动到另一个可排序元素中时触发。要使用 receive 事件,需要将其与 Sortable 的 jQuery 对象一起使用。可以在 receive 事件处理程序中执行任何操作,例如添加或删除 CSS 类。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:jQuery UI sortable receive事件 - Python技术站