javascript - 根据选择选择多行的所有 td

Question

我需要通过拖动事件选择表中的所有 td。我想要实现的是根据我第一个选择的 td 创建一个日期范围，直到最后一个选择的 td，但它们可以跨越多行。目前，我使用nextUntil()withandSelf()来包含最后选择的，但它只选择当前 tr 中的 td。下面是我的代码示例。请提供任何帮助。

this.BindCalendarMouseDrag = function () {
        var isMouseDown = false;
        var isHighlighted;
        var selectedDays = [];
        $(".tabCalendarContainer tr.trCalWeek td")
            .mousedown(function () {
                isMouseDown = true;
                $(this).addClass("highlighted");
                isHighlighted = $(this).hasClass("highlighted");
                selectedDays.push($(this));
                return false; // prevent text selection
            })
            .mouseover(function () {
                if (isMouseDown) {
                    $(this).addClass("highlighted", isHighlighted);

                    var firstSelectedDay = selectedDays[0];
                    firstSelectedDay.nextUntil($(this)).andSelf().add($(this)).addClass("highlighted", isHighlighted);

                    selectedDays.push($(this));
                }
            })
            .bind("selectstart", function () {
                return false;
            });

        $(document).mouseup(function () {
            isMouseDown = false;
            //alert(selectedDays.length);
        });
    };

Answer 1

我冒昧地构建了一个 jsFiddle，它说明了一个带有可拖动工作日的日历。它还不适合 BACKWARDS 拖动，但您应该能够轻松地调整代码以适应它。

您可以在此处访问它。