首页 > 解决方案 > 如何修复可用于 Windows Touch 设备的 Jquery ui 排序?

问题描述

我尝试使用 Jquery UI 可排序功能对手风琴进行排序。它适用于 Android 手机和 iPad。它也适用于桌面上的鼠标。当我在 Windows 10 Touch 设备上尝试它时,它在所有浏览器(Firefox、Chrome、Edge、Opera)中都失败了。

我目前正在使用 jquery-3.4.1(boostrap 等必需品)、JQuery UI v1.12.1 和 jQuery UI Touch Punch 0.2.3。

我尝试使用 JQuery Mobile,但它不适用于所有设备。


$(function () {
$("#accordion")
    .collapse()
    .sortable({
        delay: 200,
        opacity: 0.5,
        forcePlaceholderSize: true,
        update: function (event, ui) {
            var order = "";
            var divs = $("#accordion").children("div");
            divs.each(function () {
                var x = $(this).attr("data-customid");
                order = order.concat(x + ";");
            });
            var token = getCookie("jwtToken");
            $.ajax({
                url: 'https://api.example.net/api/project/update/' + order,
                type: 'POST',
                headers: {
                    Authorization: "Bearer " + token
                },
                success: function (msg) {
                    var arrayk = msg.split(";");

                    arrayk.forEach(function (e) {
                        console.log(e);
                        if (e != "") {

                            var arrayX = e.split(":");
                            var projectId = arrayX[0];
                            var status = arrayX[1];
                            console.log(status);
                            console.log(projectId);

                        }
                    });

                    $("#success-alert").fadeTo(2500, 500).slideUp(500, function () {
                        $("#success-alert").slideUp(500);
                    });
                }
            });
        },
        connectWith: "#dropCard",
        axis: "y"
    });


$("#dropCard")
    .sortable({
        connectWith: "#accordion"
    });
});

标签: javascriptjqueryhtmljquery-ui-sortable

解决方案


推荐阅读