1
fengluo OP 补图 http://d.pr/Ipgj
类似于这样的实现 |
2
kayue 2010-11-17 10:51:08 +08:00
Mission impossible with textarea (let me know if you have an idea).
But if it is just a simple textbox, you should check this out: http://devthought.com/projects/mootools/textboxlist/ Basically it is tons of auto-grow width textbox. So every time a person type "#", you create a new text box, then it is possible to get the position of that new text box element. |
3
fengluo OP @kayue 我知道有autocomplete这个插件,我也用过的。不过却不是我想要的实现……
这个我也只在rememberthemilk这个网站中看到有这个实现的……就是我给的图中显示的样子…… 我再研究研究看吧~ |
4
fengluo OP @kayue 我想大概理解你的意思了~把输入区域的样式模拟成textbox的样式,但是里面由几个textbox组成,就可以通过textbox的大小来判断新textbox的位置~是这个意思吧~查看了这个autocomplete的源码还有facebook输入区域的源码了解这点的~
|
5
remember2015 2010-11-18 10:46:44 +08:00
http://media.chikuyonok.ru/content-assist/
这个很不错,应该适合你,PS:Safari下效果最佳 |
6
leben 2011-06-08 16:57:18 +08:00
@fengluo 请问这个问题你解决了吗?在IE下可以获得boundingTop等一列信息,但是ff怎么实现啊。
@remember2015 这个效果很好,看了一下午还是没看明白菜单弹出的位置坐标是怎么计算出来的,能指点一下吗? |
7
fengluo OP @leben 哈~刚上V2ex就看到这老贴⋯⋯我研究过各种类似的实现。比如facebook的status输入实际上是用把div的属性变成了editable~使之可输入,然后通过js提交。在div里比较方便获取鼠标位置。不过facebook的实现还是在整个输入框下出现提示框。
@remember2015 提供的这个实例很赞⋯⋯当时漏了,应该是v2ex那会还没提醒功能。代码暂时还没看明白,不过也应该是用div定位的 |
8
leben 2011-06-08 18:12:07 +08:00
@fengluo 关键是光标位置,在textarea里面输入的时候,光标和鼠标位置是不一样的。keypress产生的event本身没有pagex。在ie下可以用boundingtop等属性获得,但是w3c dom里面没有对应的属性。facebook那几个例子autocomplete还是以input为基准位置的。离remember2015的这个样子还是差太大了,看了一下午content-assist,还是没看明白是怎么实现的。。。汗。
|
9
Hyperion 2011-06-08 18:30:20 +08:00
厉害...好像...好像坐标是一行行算出来的...
本地调试中... (https://github.com/sergeche/tx-content-assist/blob/master/src/TextViewer.js) |
10
Hyperion 2011-06-08 21:14:39 +08:00
|
12
fengluo OP @Hyperion v2ex给img.ly的图加了基于gae的镜像代理,如果没被墙应该能看到。不过我一直挂vpn的⋯⋯
|
14
fengluo OP @Hyperion 嗯~以前我自己试着架设这个镜像代理的时候,创建的第一个application,访问不了。我创建第二个application,取了一个跟镜像代理无关的名字才OK。觉得可能是关键字过滤之类⋯⋯纯属臆测了~
|
15
reducm 2011-11-23 02:14:41 +08:00 via Android
以前写过一个类似就新浪微博输入@符号时光标下方能有框提示,实际是写一个与当前textarea相同大小的div而每当textarea有键盘事件或输入或点击时,同步内容到div,并在光标相对div的位置插一个空span,那span到div的距离就是光标与textarea的相对距离了
|