Question

我有一个用.NET构建的时间选择器，它是一种表格格式。每行的值为30分钟的时间间隔。我已经实现了jquery，让我点击开始时间并向下拖动列表并选择结束时间来选择时间范围。我遇到的问题是jquery存储被点击的第一行的值，并将结束时间存储在'mouseovered'的最后一行中。到目前为止，这是jquery。

<script type="text/javascript">
$(function () {
    var isMouseDown = false;
    var begintime;
    var endtime;
    $("#BodyLeft_timeTable td").mousedown(function () {
        isMouseDown = true;
        $(this).toggleClass("highlighted");
        return false;
    }).mouseover(function () {
        if (isMouseDown) {
            $(this).toggleClass("highlighted");
        }
    }).bind("selectstart", function () {
        return false;
    });

    $(document).mouseup(function () {
        isMouseDown = false;
        window.location.href = "HoursDetail.aspx";
    });
});
</script>

以下是我选择时间的图片的链接。当触发mouseup事件时，选择的第一次和最后一次用于重定向到新页面并在查询字符串中包含这两个值。

http://i869.photobucket.com/albums/ab251/bradedwards0978/timepicker.png

任何帮助都会很棒。

感谢。

Answer 1

希望这有效，或者你至少可以很好地了解我的目标。

//Select all cells that contain the class "highlighted"
var selected = $("#BodyLeft_timetable td").filter('.highlighted');
//select first & last for range
var first = selected.first().id;
var last = selected.last().id;

var href = "HoursDetail.aspx?first=" + first + "&last=" + last;
window.location.href = href
//ex: HoursDetail.aspx?first=0830am&last=0100pm

扫描DOM以查找highlighted的数据单元格（由您应用于它们的css类指示）。从该集合中，抓取id个first and last个对象。使用query string加载id's。

我可能看到的唯一问题是，我不知道您是否在表each cell中给出了individual ID，或者是否会出现问题。您可以做的是为每个单元格分配data-time属性和值1pm 930am等，而不是抓住.id，您可以抓住.attr('data-time') < / p>

需要jquery来存储mousedown和mouseover上的表列值

1 个答案: