代码之家 › 专栏 › 技术社区 › Shawn D.

计划的HTML自定义输入类型

jsp html javascript

Shawn D. · 技术社区 · 15 年前

我正在寻找一种方法来为我正在开发的Web应用的用户的任务输入一个“时间表”,并让它在我的用户界面的多个页面上使用。

我在寻找一些可以让我配置是否被手动触发、每月/每周/每天/每小时运行等的内容,然后根据配置的频率显示子字段,例如每月+每天的时间,每周+每天的时间,每天的时间等。

我在想我可以使用多个选择字段,当选择的频率表明我不需要它们时,可以使用javascript隐藏/显示适当的子字段。但是,因为我想在多个页面上使用它,所以如果有更好的方法,我不想在页面之间复制一堆东西。

在内部,它可能会转换为crontab格式,并使用spring进行调度,但我不想在文本框中显示crontab格式,因为它缺乏用户友好性。

有人有什么建议吗?我将Struts2用于用户界面,而不将任何JavaScript库用于任何用途。不确定这是否是jquery之类的东西容易实现的类型,或者什么。

谢谢。

3 回复 | 直到 13 年前

Anurag 15 年前

jquery是一个选项,因为它使跨浏览器的事件处理一致,但是,编写一个简单的函数,它可以在所有浏览器中以一种简洁的方式进行,这也是非常简单的,因此仅对于这个小部件,我不建议创建对jquery的依赖。

哦,把输入类型想象成一个小部件或组件,它有一个体面的公共接口,您可以将其实例化并嵌入到任何需要它的页面中。看看大多数像谷歌日历这样的网络日历解决方案是如何实现的,因为它们也需要考虑到周期性事件,而且对于最终用户来说仍然保持简单。他们有一个解决UI问题的解决方案,即获得非常复杂的重复时间,例如:

每5年7月13日
每2个月第二个星期二
星期二、星期三
每隔4天

对最终用户来说是一种简单的方式。以下是几个例子:

使用自定义步长每年重复

alt text http://img17.imageshack.us/img17/8122/picture1be.png

在每月的某一天使用自定义步长的每月重复

alt text http://img706.imageshack.us/img706/8036/picture2so.png

比如说,使用包含小部件的自包含脚本文件 ScheduleWidget.js 您可以在每个需要它的页面上引用它,或者将它捆绑在一个小型/打包的脚本中,这样所有页面都可以访问它。

保持接口的简单性,以便尽可能少地将其插入任何DOM元素中。

var widget = new ScheduleWidget();
var container = document.getElementById("scheduleContainer");
// getElement() returns the root DOM node of the dynamically constructed widget.
container.appendChild(widget.getElement());

当 ScheduleWidget 对象被实例化,它设置所有事件绑定,以便根据需要列出选择、更改等。触发逻辑/UI中的更改。

Shawn D. 15 年前

好的,所以我最终使用struts 2组件标记,并将参数传递给它,以生成具有不同名称的适当代码。这对我来说是最好的,因为使用它我仍然可以嵌套struts 2标记,我不确定是否可以通过定义自己的taglib来做到这一点。

ftrotter mario 15 年前

我也一直在寻找这个问题的答案。

我确实认为谷歌日历是一个很好的例子,它可以很好地实现这一点,我认为对于某种jquery插件或其他javascript库来说仍然有一个很好的机会。

对于任何给定的Web应用程序,很少有GUI需要能够在crontab中创建每个条目。例如,谷歌日历有一系列令人印象深刻的日程安排选项,但仍然不支持“从现在起每隔一分钟”…

对于我现在使用的Web应用程序,任何超过“每月”的内容都太长,“每日”下的内容也不起作用,我只想有以下选项

daily options
 daily
 once every two, three or four days
weekly options
 A set number of times per week (like:once, twice, etc)
 weekly on a schedule (like: Tues, Thurs, and Sat)
monthly options
 A set number of times per month (like: four, five, six)
 monthly on a schedule (like: 1st, 7th, 13th, and 21st)
 monthly on a weekly schedule (like: 1st Tuesday, 2nd Wednesday, Last Friday)

但在我看来很明显,我想要的只是一个更大的调度频率系统的一个子集,该系统包括每小时、每分钟、每年和每年+选项。

我将进一步探索javascript显示/隐藏选项,并在完成这些操作后尝试记住进一步扩展这个答案。