如何在HTML和Javascript中创建动态每周计划?

时间:2021-06-17 14:32:32

It's simple to create a table based layout for a weekly calendar with 7 columns for each day of the week and various rows for each hour of the week. I have no problem creating that. The hard part is filling in this table with daily 'events' dynamically (I'm not even sure how I would do this statically).

为每周日历创建基于表格的布局很简单,每周的每一天有7列,每周的每小时有不同的行。我没有问题创建它。困难的部分是在动态地填充每个“事件”表(我甚至不确定如何静态地执行此操作)。

The user will have access to a list of 'events' that they would like to add to their weekly schedule. And they need to be added dynamically to the webpage. Each event has a specific start and end time, and may occur on more than one day of the week. I'm not sure how I could possibly add these 'events' to my table layout without getting into a bunch of rowspan problems ( a lot of the events are various lengths and span different hours ). It would be easy if each event was always 1 hour long, but that's not the case.

用户可以访问他们想要添加到每周计划中的“事件”列表。它们需要动态添加到网页中。每个事件都有特定的开始和结束时间,并且可能在一周中的一天以上发生。我不确定如何将这些'事件'添加到我的表格布局中而不会遇到一堆行盘问题(很多事件都是不同的长度并跨越不同的时间)。如果每个事件总是1小时,那将很容易,但事实并非如此。

I was thinking of making each day a respective table with a hidden hour column. I still feel like this will result in a huge mess. Any ideas?

我想把每一天都作为一个带有隐藏小时列的相应表格。我仍然觉得这会导致一团糟。有任何想法吗?

1 个解决方案

#1


24  

Why reinvent the wheel?

为什么重新发明*?

I think this covers all your concerns.

我认为这涵盖了您的所有顾虑。

http://arshaw.com/fullcalendar/

#1


24  

Why reinvent the wheel?

为什么重新发明*?

I think this covers all your concerns.

我认为这涵盖了您的所有顾虑。

http://arshaw.com/fullcalendar/