下面是可排序的jquery代码,它在dasktop中工作正常,但在移动浏览器中不起作用,所以请建议如何解决...?
$(document).ready(function() {
$("#post_list").sortable({
placeholder: "ui-state-highlight",
handle: ".socialmediaspacing",
delayOnTouchOnly: true,
update: function(event, ui) {
var post_order_ids = new Array();
$('#post_list div.listitems').each(function() {
post_order_ids.push($(this).data("post-id"));
});
$.ajax({
url: "url",
method: "POST",
data: {
post_order_ids: post_order_ids,
"_token": "{{csrf_token()}}"
},
success: function(data) {
$('#socail-profile-mobileview').html(data);
Snackbar.show({
pos: 'bottom-right',
text: "Ordering changed successfully.",
actionText: 'Okay'
});
}
});
}
});
$( "#post_list" ).disableSelection();
});
这是由于触摸事件没有被正确识别造成的。
您可以编写自己的事件,也可以使用库来执行此操作。出于类似的目的,我使用 jQuery UI Touch Punch 并且效果很好。
您只需将
.js
文件包含在 jquery-ui.js
之后
<script src="jquery.ui.touch-punch.min.js"></script>
不需要其他任何东西,所有标准 jquery-ui 功能现在都应该在触摸设备上运行:sortable
,
draggable
等..