Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

鼠标事件中做自动全选的设计值得思考!

  有些文本框的操作大多数为重写文字,所以在用户体验设计时会增加一个鼠标事件全选文字的功能。鼠标事件有很多种,不同的产品有可能使用着不同的方式来实现的。但就是因为这个实现方式缺乏考虑,做出来的效果就会让用户很恼火,完全变成画蛇添足。
  经常会遇到一种蛋疼的情况,需要选择文本框中的一部分文字,但是用鼠标选始终选不定。一旦鼠标松开就会自动做全选文字的操作,这种设计就非常蛋疼,也许开发者只是简单地把事件绑定到click上了。
  当然通常情况下用户会去选择文本框中的一部分文字的情况并不多(正常用户一般要使用三到五次才会发现这个问题),如果面向的用户群只是临时用户,那么问题不大。但是对于一些特殊内容的文本框,选定部分文字的操作几乎是必须的,而是也是固定的用户群。这时候开发者还能做出这样蛋疼的设计!?这还真有,贴吧就做到了。

  贴吧的吧内搜索有前面的前缀,如果试图用鼠标修改后面的搜索内容是做不到的,非得通过键盘的方向键。
  其它网站也有其它鼠标全选的实现方式,比如一个很夸张的方式,直接在mousemove中focus文本框(有道词典就是这么设计的)。

  这个设计虽然很夸张,但是比起前面百度贴吧的那个设计要正常的多了,至少我可以用鼠标选中部分文字。但是这个设计也有点问题,当用户想复制文本框之外的内容时,会遇上麻烦。比如有道词典上选中翻译结果的一段文本,正打算按下Ctrl+C时鼠标不小心碰到了文本框,这是选中的文本就失去了选区,按下Ctrl+C则变成复制文本框中的内容。所以这样强行夺取焦点的行为也是有点蛋疼的。
  对于文本框的自动全选效果做的最好的那家伙其实就在我们身边,它就是浏览器本身。浏览器对地址栏这个文本框的实现效果非常好(在Chrome和Firefox上测试)。在文本框无焦点时候点击才会全选内容,因为浏览器猜测此时用户要输入新的网址。如果地址栏已经获取到焦点了,之后的click事件就不会再做全选操作。而且如果在没有焦点的时候直接拖动鼠标去选中部分文字,它也认为用户是想修改部分内容,而不是重新输入,此时也不会自动全选。
  这样智能的判断才符合用户操作习惯。就这样小小的问题,对于用户体验而言影响也是巨大的。
网名:
54.144.24.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^