仅在选择器中可见的项目始终返回 -1

Visible items only in selector always returns -1

本文关键字:项目 返回 选择器      更新时间:2023-09-26

(在这里使用 jquery UI)

小提琴:http://jsfiddle.net/sP3UZ/2677/

目标:拖动任何蓝色按钮时,另一个按钮应该被隐藏,我通过 index() 计算 dom 上以前的.user_task实例。

我的选择器中没有 :visible 部分,代码可以正常工作,我得到我单击的项目之前的总数,在选择器中添加 :visible 它总是返回 -1。

$("#sortable").sortable({
    items: ".user_task",
    appendTo: "body",
    helper: "clone",
    revert: true,
    start: function(event, ui) {
        var taskid = ui.item.data("taskid");
        $("[data-taskid='" + taskid + "']").not(ui.helper).hide();
        var x = $(".user_task:visible").index(ui.item);
        $("#counter").text(x);
    },
}); 

我的最终结果应该是,拖动最后一个蓝色按钮和 x=2(例如)

一个讨厌的黑客

$("#sortable").sortable({
    items: ".user_task",
    appendTo: "body",
    helper: "clone",
    revert: true,
    start: function (event, ui) {
        var taskid = ui.item.data("taskid");
        $("[data-taskid='" + taskid + "']").not(ui.helper).hide();
        var $usertasks = $(".user_task");
        var all = $usertasks.index(ui.item);
        var hidden = $usertasks.slice(0, all).not(':visible').length;
        var x = all - hidden;
        $("#counter").text(x);
    },
});

演示:小提琴