【问题标题】:Calendar widget (JavaScript) and usability issue日历小部件 (JavaScript) 和可用性问题
【发布时间】:2011-11-29 18:38:19
【问题描述】:

我想使用日历小部件来帮助用户选择日期。

我希望使用任何独立的日历或作为 jQuery 插件。在我的项目中,我使用的是 jQuery,我不想使用任何其他框架。

我看过很多日历,但它们都有相同的问题。现在我将描述它,见下文:

显示日历有两种可能的方式:

  1. 点击某个按钮、图标等来显示它。
  2. 点击文本字段(我们将在其中看到日期选择的结果)以显示它

我选择了第二种方式。就我而言,我将只有一个文本字段,没有任何附加图标、按钮等。 当此文本字段获得焦点时,将显示日历。当用户选择任何日期时,日历将被隐藏,文本字段将显示所选日期。

这里我有一个主要问题......

出现日历后,文本字段失去焦点。并且在选择日期之后,焦点没有回到该字段,并且 tab 键(在键盘上)从开始运行。

从可用性的角度来看,如果用户从日历中完成选择日期,并且选择的日期显示在文本字段中,他可以继续使用 tab 键转到下一个文本字段,那将是很好的。

有什么办法解决吗?

附:我只有一个想法,但我不喜欢它,因为它看起来有点丑

当日历显示时,我可以销毁文本字段上的事件处理程序(焦点事件)。 当用户选择的日期和日历消失时,我可以在此文本字段上设置焦点并再次为该文本字段附加事件侦听器(焦点)。

【问题讨论】:

    标签: javascript jquery jquery-events usability


    【解决方案1】:

    由于 JavaScript 是单线程语言,您可以简单地将变量(disableEvents 或其他东西)设置为 true,然后在调用 .focus() 时将其设置回 false - 这不会造成任何麻烦并且不会不需要太多的工作。

    【讨论】:

      【解决方案2】:

      jQuery-UI's datepicker 不会将焦点发送到弹出日历小部件,而是希望用户使用替代控件来更改日期,此外这将允许用户在他们选择时手动输入日期。

      【讨论】:

      • 用户不应该手动写日期,他们可以随时出错。这就是为什么我在想他们应该从日历中选择什么。他们必须有能力使用键盘或鼠标来填写表格。从一个字段跳转到另一个字段通常通过鼠标单击或按 TAB 键来实现。而且我不喜欢 jquery UI。谢谢
      • @user1016265,UI 小部件的设计考虑了可访问性。无论如何,用户都必须使用键盘、鼠标或等效的输入设备。如果他们禁用了 JavaScript,他们也需要手动输入日期。
      • 我的意思是在使用jquery UI日历后你不能一直使用TAB键跳转到下一个字段,你可以自己尝试
      • @user1016265,标签与日期选择器配合得很好;如果您关注日期选择器显示的字段,然后点击选项卡,您的焦点将转到下一个交互式元素。这是预期的行为。
      • @user1016265,这里是a fiddle i threw together,标签可以正常工作。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-06-12
      • 2013-03-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-01-18
      相关资源
      最近更新 更多