从用户那里获取号码的最佳方法是什么?
我想知道一小段数字 [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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
如果用户主要与键盘交互,请考虑使用常规编辑框并进行限制测试。 这比点击向下箭头选择其他数字要容易得多。
如果它是基于鼠标的并且您有空间,那么按钮网格或收音机会很快。
如果是基于键盘的,那么 Jakob Nielsen 在他的 Alertbox 文章下拉菜单中写道:谨慎使用,请注意:
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:
下拉菜单很好,数字范围较小,可以快速访问该范围两端的数字。 请记住,用户可以使用 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.
谢谢你们的好心回复。
根据一些可用性测试,我认为
NumericUpDown 控件又名 NumberSpinner 最适合选取小范围内的数字,例如 1-100
经过验证的文本框非常适合输入大量数字
下拉菜单可能只适合较小的数字范围,例如 1-10下拉菜单的长度(上网本用户?移动电话用户)
单选按钮网格不如下拉菜单,因为用户必须扫描整个屏幕长度才能选择他的号码
单选
所以向 damien 致敬他关于验证以防止使用 firebug 更改号码的提示。
Thanks for the kind replies guys.
From some usability testing, I figure that
the NumericUpDown control aka NumberSpinner is the best for picking numbers within a small range eg 1-100
a validated textbox works well for entering in large numbers
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)
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.
如果您更喜欢 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.