是否可以使用 Javascript 获取文本的像素坐标并在其周围绘制矩形边框？
我正在评估即将到来的项目的技术选项，其中一个要求是在文本字段中的某些单词组周围绘制一个矩形。 每次评估和解析文本时，必须用矩形框住文本的某些已识别部分，该矩形也应该响应鼠标单击。甚至需要在这个矩形的一个角上放置一个小三角形。 我无法控制这些要求，显然这个要求指出了获取文本字段（或 div 容器）中文本的像素位置，并使用某种覆盖机制来绘制矩形。 除非我使用了错误的关键字，否则谷歌搜索不会返回任何有用的结果，我非常感谢您对此主题的输入。
此致 塞雷夫·阿里坎 PS：任何有关使用 javascript 的基于 DOM 的高级浏览器图形的书籍/资源也值得赞赏。
I am evaluating technology options for an upcoming project, and one of the requirements is to draw a rectangle around certain groups of words in a text field.
Each time the text is evaluated and parsed, certain recognized parts of it must be boxed with a rectangle, which should also respond to mouse clicks. There is even a requirement to place a little triangle to one of the corners of this rectangle.
I have no control over the requirements, and clearly this requirement points out to getting pixel positions of text in a text field (or a div container), and using some sort of overlay mechanism to draw the rectangle.
Unless I am using the wrong keywords, google searches return no helpful results, and I'd really appreciate your input about this topic.
Best Regards
Seref Arikan
Ps: any books/resources about advanced browser dom based graphics with javascript be appreciated also.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
我建议查看这个插件： http: //johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
这并不完全是您想要的，但您也许可以调整它。在运行内容中查找文本然后对其进行操作的工作有点混乱。
编辑请注意，该插件适用于 HTML 文档中的文本，而不是输入文本字段或
I would recommend looking at this plugin: http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
It's not exactly what you want, but you might be able to adapt it. The work of finding text in running content and then manipulating it is a little messy.
edit note that that plugin is for text in the HTML document, not text in input text fields or in
<textarea>blocks. That would be pretty hard to do, but possibly somebody's done it.我建议您使用多个无边框文本字段，每个字段包含文本的单个部分（单词或字母），并根据需要将组包装在跨度样式中，并使用边框和三角形作为定位背景图像。
I suggest you use multiple, borderless text fields, each containing a single part of the text(words or letters) and wrap groups as needed in span styled with a border and the triangle as a positioned background image.