从用户那里获取号码的最佳方法是什么?

发布于 2024-07-30 13:19:57 字数 340 浏览 9 评论 0原文

我想知道一小段数字 [1..20],您会建议使用什么样的控件来提示用户进行选择。

我正在考虑使用 NumericUpDown 控件,但 WebForm 不存在它,更糟糕的是,我正在 Pylons 应用程序(Python 框架)上部署

您觉得 DropDown 控件就足够了吗? 从用户的角度来看,我仍然觉得 NumericUpDown 控件更直观、更易于使用。

会喜欢 SO 社区的意见,也许还会就最佳实践提出建议。

非常感谢!

编辑:忘记提及我正在使用 YUI 库和 webhelpers 库,据我所知,没有这样的控件具有与 numericupdown 相同的功能

I was wondering for a small list of numbers [1..20], what kind of control will you advise to prompt the user for his selection.

I was thinking of a NumericUpDown control but it does not exist for WebForm and to make matters worse, I am deploying on a Pylons application (Python Framework)

Do you feel a DropDown control will suffice? I somehow still feel a NumericUpDown control is much more intuitive and easier to use from a user standpoint.

Will love the opinions of the SO community and perhaps advise about best practices.

thanks so much!

edit: forgot to mention that I am using the YUI library and the webhelpers library and to the best of my meagre knowledge, there is no such control with equivalent functionality to the numericupdown

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

转身泪倾城 2024-08-06 13:19:58

如果用户主要与键盘交互,请考虑使用常规编辑框并进行限制测试。 这比点击向下箭头选择其他数字要容易得多。

如果它是基于鼠标的并且您有空间,那么按钮网格或收音机会很快。

如果是基于键盘的,那么 Jakob Nielsen 在他的 Alertbox 文章下拉菜单中写道:谨慎使用,请注意:

要避免的设计

下拉菜单确实有其优点。 首先,它们节省屏幕空间。 它们还可以防止用户输入错误数据,因为它们只显示合法的选择。 最后,因为它们是一个标准的小部件(即使是一个令人不快的小部件),所以用户在遇到下拉菜单时知道如何处理它。

尽管有这些优点,但如果设计者减少使用下拉菜单,Web 的可用性将会提高。 为此,以下是一些应避免的设计示例:

  • 州缩写菜单,,例如美国邮寄地址。 对于用户来说,简单地键入“NY”比从滚动下拉菜单中选择一个州要快得多。 对具有受限选项的字段进行自由格式输入确实需要在后端进行数据验证,但从可用性的角度来看,这通常是最好的方法。 (这是电子商务可用性的指南#178,因为我们在带有状态下拉菜单的签出表单。)

  • 用户熟知的数据菜单,例如出生月份和年份。 此类信息通常硬连线到用户的手指中,并且必须从菜单中选择此类选项打破了输入信息的标准范例,甚至可能为用户带来更多工作,如以下示例所示。

If the user is interacting mostly with the keyboard, consider just a regular edit box with a test on the limits. It's much easier than banging the down arrow to choose some other number.

If it is mouse-based and you have room, a grid of buttons or radio-set would be quick.

If it is keyboard based, then Jakob Nielsen wrote in his Alertbox article Drop-Down Menus: Use Sparingly, this note of caution:

Designs to Avoid

Drop-down menus do have their advantages. First, they conserve screen space. They also prevent users from entering erroneous data, since they only show legal choices. Finally, because they are a standard widget (even if an unpleasant one), users know how to deal with a drop-down menu when they encounter it.

Despite these advantages, Web usability would increase if designers used drop-downs less often. To that end, here are some examples of designs to avoid:

  • Menus of state abbreviations, such as for U.S. mailing addresses. It is much faster for users to simply type, say, "NY," than to select a state from a scrolling drop-down menu. Free-form input into fields with restricted options does require data validation on the backend, but from a usability perspective it's often the best way to go. (This is guideline #178 for e-commerce usability because of the many errors we observed in check-out forms with state drop-downs.)

  • Menus of data well known to users, such as the month and year of their birth. Such information is often hardwired into users' fingers, and having to select such options from a menu breaks the standard paradigm for entering information and can even create more work for users, as the following example shows.

淡莣 2024-08-06 13:19:58

下拉菜单很好,数字范围较小,可以快速访问该范围两端的数字。 请记住,用户可以使用 firebug 或其他方法更改下拉列表的选定值,因此请使用验证来确保提供的数字在范围内。

A drop down is fine, smallish range of numbers, allows quick access to numbers at either end of the range quickly. Remember though that a user could change the selected value of the drop down using firebug or something so use validation to ensure the number provided is in range.

橘香 2024-08-06 13:19:58

谢谢你们的好心回复。

根据一些可用性测试,我认为

  1. NumericUpDown 控件又名 NumberSpinner 最适合选取小范围内的数字,例如 1-100

  2. 经过验证的文本框非常适合输入大量数字

  3. 下拉菜单可能只适合较小的数字范围,例如 1-10下拉菜单的长度(上网本用户?移动电话用户)

  4. 单选按钮网格不如下拉菜单,因为用户必须扫描整个屏幕长度才能选择他的号码

    单选

所以向 damien 致敬他关于验证以防止使用 firebug 更改号码的提示。

Thanks for the kind replies guys.

From some usability testing, I figure that

  1. the NumericUpDown control aka NumberSpinner is the best for picking numbers within a small range eg 1-100

  2. a validated textbox works well for entering in large numbers

  3. a drop down menu may be only suitable for smaller number ranges eg 1-10 due to the length of the drop down (netbook users? mobile phone users)

  4. a grid of radio button is not as good as a drop down menu since the user have to scan the entire screen length to pick his number

a hats off to damien to his tip about validation to prevent alteration of numbers using firebug.

疧_╮線 2024-08-06 13:19:58

如果您更喜欢 NumericUpDown 样式,您可以使用 javascript 轻松制作一个简单版本。 我已经用 jQuery 完成了它,所以我不能真正给你使用 YUI 的具体细节,但总的来说,这就是我所实现的。 创建一个标准文本框,其中预先设置默认值,并将其设置为只读。 添加向上和向下按钮并按照您想要的方式设置它们的样式(我使用 div,在框左侧向下,在右侧向上)。 向每个按钮组添加单击事件以增加或减少文本框的值。 在脚本中,限制值的范围,同时验证输入以确保它不会按照之前的建议进行更改。 诚然,我不是这方面的专家,所以可能有更简单的方法来做到这一点。

If you prefer the NumericUpDown style, you can make a simple version pretty easily using javascript. I've done it with jQuery, so I can't really give you specifics on doing it with YUI, but in general, here's what I've implemented. Create a standard text box with the default value pre-set in it, and it set to readonly. Add up and down buttons and style them how you want (I used divs, down on the left of the box, up on the right). Add a click event to each button set to increase or decrease the value of the text box. In your script, limit the range of the values, but also validate the input to be sure it isn't changed as advised before. I'm admittidly no expert on any of this, so there may be easier ways to do it.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文