如何使用户能够从客户端在完整日历中添加营业时间？

Question

我正在寻找完整日历的解决方案，以添加由客户端本身添加业务时间的功能。目前，我在完整日历方面仅找到并实现了硬编码版本。

selectConstraint: 'businessHours',

    eventConstraint: 'businessHours',

    businessHours: [

        {

            dow: [1, 2, 3], // Monday, Tuesday, Wednesday

            start: '09:00',

            end: '18:00'

        },

        {

            dow: [4, 5], // Thursday, Friday

            start: '09:00',

            end: '18:00'

        }

    ],

它在日历上看起来是这样的，但它是硬编码版本，无法由用户在客户端添加或编辑。

也许建议一些外部图书馆在完整日历上设置时间表和营业时间。

Answer 1

您可以在 html 中添加输入字段，然后将字段值关联到变量，如下所示： html&nbsp;<label for="startHour1">start hour: </label><br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" id="startHour1" name="startHour1" /><br />&nbsp;<label for="endHour1">end hour: </label><br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" id="endHour1" name="endHour1" /><br />JavaScriptvar starthour = document.getElementById("startHour").value;selectConstraint: 'businessHours',&nbsp; &nbsp; eventConstraint: 'businessHours',&nbsp; &nbsp; businessHours: [&nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dow: [1, 2, 3], // Monday, Tuesday, Wednesday&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; start: starthour1 ,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; end: endhour1&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;},&nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dow: [4, 5], // Thursday, Friday&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; start: starthour2 ,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; end: endhour2&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; ],希望这有帮助！