Javascript:如何用箭头键控制模拟光标来定位 DOM 编辑?
我正在使用 Javascript 构建一个浏览器内 IDE。代码/小部件存储在文档中。我想要控制编辑过程,因此我拦截击键并在 DOM 中的编辑点处显示模拟光标。 (起初我尝试使用 contenteditable = true 但这并没有给我足够的控制权。)
我已经取得了一些进展,因此单击将在 div 的开头插入光标,并且右箭头将移动到下一个节点,虽然现在我意识到我必须深入研究内容()并跟踪文本节点中的光标位置..
我想知道是否有人知道我可以参考或复制的任何代码或其他东西,而不是重新发明轮子。我正在使用 jQuery,但这不是必需的。
I'm building an in-browser IDE using Javascript. The code/widgets are stored in the document. I want control over the editing process so I am intercepting keystrokes and displaying a simulated cursor where the edit point is in the DOM. (At first I tried using contenteditable = true but that isn't giving me enough control.)
I've made some progress so that clicking will insert the cursor at the beginning of the div and the right arrow will move to the next node, although now I am realizing that I am going to have to dig into the contents() and keep track of my cursor position in text nodes..
I'm wondering if anyone knows of any code out there that I can refer to or just copy or something rather than re-inventing the wheel. I am using jQuery but that isn't a requirement.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
也许 Mozilla Bespin 可以提供帮助。但恕我直言,如果您不能使用 contenteditable,您将需要编写大量代码。
Perhaps Mozilla Bespin can help. But IMHO if you can't use contenteditable you'll need to write a lot of code.