Javascript:短时记法

Javascript: Short time notation

目前我正在制作一个日程安排应用程序。在此应用程序中,我们希望确保我们的用户能够非常快速地插入时间。所以这是我的计划(参见下面的 JSfiddle link):

我希望我的用户单击其中一个空的 table 单元格,然后会出现一个文本字段,用户可以填写 2 个时间标记,一个从开始,一个到直到。用户按下回车键后,时间将保存为 div,保存在与文本字段出现的位置相同的位置。正如您在我的 fiddle:

中看到的那样,这部分已经在工作了

https://jsfiddle.net/rhantink/jm294oLk/3/

var tableFunctions = {


"createTimeBox": function () {
    var timeBox = document.createElement("input");
    $(timeBox).addClass("timeBox");
    $(timeBox).attr('type', 'text');
    $(timeBox).keypress(function (e) {
        if (e.which == 13) {
            var timeEntry = tableFunctions.createTimeEntry($(this).val());
            $(".timeBox").replaceWith(timeEntry);

            console.log(this);
        }
    });
    return timeBox;

},

    "createTimeEntry": function (textEntry) {
    var timeEntry = document.createElement("div");
    $(timeEntry).addClass("timeEntry");
    $(timeEntry).text(textEntry);

    return timeEntry;
}

}




var scheduler = {
    "Applicatie": 'HRM2.0',

        "init": function () {
        console.log('Init');

        $(".day").click(function () {

            $('.timeBox').remove();
        var timeBox = tableFunctions.createTimeBox();
        $(this).append(timeBox);
        $(timeBox).focus();



        })
    }

}


$(document).ready(

scheduler.init()

)

但是...用户需要能够输入“12-16”或“1200-1600”,然后按回车键。对于 javascript,我想进行翻译,使时间在 div 中显示为“12:00 - 16:00”。稍后,我还希望他们输入“9-17c”,其中 'c' 代表课程,这意味着他们将那个时间 window 用于某些课程。 我的问题是: 是否有任何 javascript 框架可以使这更容易,或者是否有人可以通过开发这样的东西为我指明正确的方向?

也请随时对我的编码发表评论。

谢谢,

罗伯特

你应该使用 Regular Expressions。您可以测试用户使用特定模式写的内容,如果匹配,您就可以进行翻译。

例如测试'12-16'字符串:

if(/([0-9]{2})-([0-9]{2})/.test($('#inputID').val()))
  //do your thing

这是一个关于正则表达式的小 fiddle