javascript - javascript时间重叠问题

标签 javascript jquery json html

我正在项目中的添加任务模块中工作。我想在每次任务添加时检查现有任务是否重叠。我几乎做到了,但是,在时间重叠条件下出现一个问题,不允许添加任务,例如,如果用户在以下时间添加任务,如下所示:

09:00 AM - 10:00 AM

10:30 AM - 11:00 AM

如果我将任务添加到上午 10:00 到上午 10:30 之间,在我的情况下不允许:

function disabletime(start_time, end_time) {
    var start_date = new Date(new Date(start_time).getTime());
    var end_date = new Date(new Date(end_time).getTime());

    var disable_times = new Array();
    var max_date = 0;
    var min_date = 0;

    if (tasks_array.length > 0) {
        for (var i = 0; i < tasks_array.length; i++) {

            var prev_s_date = Date.parse("1-1-2000 " + tasks_array[i].start_time);
            var prev_e_date = Date.parse("1-1-2000 " + tasks_array[i].end_time);
            var prev_start_date = new Date(new Date(prev_s_date).getTime());
            var prev_end_date = new Date(new Date(prev_e_date).getTime());
            if (i == 0) {
                min_date = prev_start_date.getTime();
                max_date = prev_end_date.getTime();
            } else {

                if (prev_end_date.getTime() > max_date) {
                    max_date = prev_end_date.getTime();
                }

                if (prev_start_date.getTime() < min_date) {
                    min_date = prev_start_date.getTime();
                }
            }
        }
        if ((start_date.getTime() == min_date) && (end_date.getTime() == max_date)) {
            alert("Check the start and end time for this task!");
            return false;
        } else if ((start_date.getTime() < min_date) && (end_date.getTime() <= min_date) || (start_date.getTime() >= max_date) && (end_date.getTime() > max_date)) {

        } else {
            alert("Check the start and end time for this task!");
            return false;

        }
    }
    start_date = new Date(start_date.getTime() + 30 * 60000);
    while (start_date < end_date) {
        disable_times.push([start_date.getHours(), start_date.getMinutes()]);
        start_date = new Date(start_date.getTime() + 30 * 60000);
    }

    return true;
}

这是我的代码流程,我将所有任务添加到 JavaScript 中的 json 数组中。每次添加新任务时检查 json 数组对象上的现有任务(如果任务存在则在内部)时间是否重叠。

<强> Here is a fiddle

最佳答案

我认为这是一个“如果你想调试就重构”的情况。
只需将您的问题分解为孤立的、小而简单的问题,您就能比任何深度调试任务更快地找到解决方案。
您应该通过使用对象来分解代码的复杂性, 这样您就可以清楚地了解谁做了什么,并且可以进行测试 轻松地完成每个部分。
我不确定下面的代码是否满足您的所有需求,但它 应该更容易使用:我定义了 2 个对象:一个任务, 和一组任务。
对于每个我定义了非常简单的方法,易于阅读和调试。

我没有测试结果,但你会知道如何做 你想要从这里开始。

http://jsfiddle.net/gamealchemist/b68Qa/2/

// ------------------------------  
// Task
function Task(startDate, endDate) {
    this.start = startDate;
    this.end = endDate;
}

// returns wether the time range overlaps with this task
Task.prototype.overlap = function (start, end) {
    return (this.start <= end && this.end >= start);
}

// returns a string describing why the task is wrong, or null if ok
function checkTask(start, end) {
    if (start > end) return "End time should exceed the start time";
    if (start == end) return "End time should not same as the start time";
    return null;
}

现在是一组任务:

// ------------------------------  
// Task Set
function TaskSet() {
    this.tasks = [];
    this.minDate = 0;
    this.maxDate = 0;
}

// returns a string describing why the task cannot be added, or null if ok
TaskSet.prototype.check = function (start, end) {
    var tasks = this.tasks;
    // 1. Check date is valid
    var dateCheck = checkTask(start, end);
    if (dateCheck) return dateCheck;
    // 2. overlap check
    for (var i = 0; i < tasks.length; i++) {
        var thisTask = tasks[i];
        if (thisTask.overlap(start, end)) {
            return 'time overlaps with another task';
        }
    }
    return null;
}

// add the task.
TaskSet.prototype.add = function (start, end) {
    var tasks = this.tasks;
    if (task.length) {
        this.minDate = start;
        this.maxDate = end;
    }
    if (start < minDate) minDate = start;
    if (end > maxDate) maxDate = end;
    // you might want to check before inserting.
    tasks.push(new Task(start, end));
}

// displays the current task inside the tasks div.
TaskSet.prototype.show = function () {
    var tasks_array = this.tasks;
    $("#tasks").html('');
    $.each(tasks_array, function (index, item) {
        var newRowContent = "<div>" + item.start_time + "-" + item.end_time + "</div>";
        $("#tasks").append(newRowContent);
    });
}

让我们使用这些对象:

// ---------------------------
var myTasks = new TaskSet();


$("#addtask").click(handle_AddTask_Clicked);

function handle_AddTask_Clicked(e) {
    e.preventDefault();

    var start = $("#task_stime").val();
    var end = $("#task_etime").val();

    var start_time = Date.parse("1-1-2000 " + start);
    var end_time = Date.parse("1-1-2000 " + end);

    var checkCanAdd = myTasks.check(start_time, end_time);
    if (!checkCanAdd) {
        myTasks.add(start_time, end_time);
        myTasks.show(); // notice you might auto-refresh withinin add
    } else {
        alert(checkCanAdd);
    }
}

关于javascript - javascript时间重叠问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21305318/

相关文章:

php - 外部编辑 JavaScript 变量

javascript - webview.executeJavascript 不是函数

javascript - 如何在使用 jquery 关闭前一个 div 时打开下一个 div?

jquery - 单击缩略图时获取YouTube videoID吗?

php - 如何在 PHP session 中存储 javascript 数组?

javascript - Angularjs 使用 ng-init 为 ng-model 赋值

javascript - Mongodb 获取所有集合项的数组项计数

php - 从 PHP 返回两个 2 json 对象

ios - 从 JSON 图像 url swift 填充 collectionView

javascript - 使用变量在 JavaScript 中解析 JSON