我有两个文本区域。 TA1用于样式/显示,TA2用于输入捕获以及将插入标记放置在span标签上的功能。它们将始终具有相同的值,但TA1将包含用于样式的其他html。
TA1被TA2覆盖。基本上,如果单击了文本区域,则TA2将接收该事件。
我试图根据TA2中的光标位置在TA1中选择一个元素。我知道在TA2中单击的单词范围,但是需要在TA1中选择适当的跨度。基本上,我需要单击TA2并触发TA1中的处理程序。
我一直在尝试查看是否有可能将插入符号放在TA1中的跨度之后,并选择先前的跨度,但是到目前为止,我还没有获得任何成功。
这是TA1中文本的示例,
<textarea>
<span class=\"suggestion\" title=\"Click to edit\">TESTP</span>\n
\n
123\n
\n
TESTING\n
\n
123\n
\n
<span class=\"suggestion\" title=\"Click to edit\">TESTP</span>
</textarea>
上面的html将呈现为以下内容。
例如,如果单击第一个“ TESTP”,则范围为0-4。如果将插入号放在TA1上的位置5,是否可以选择span标签?我将尝试查看是否也可以使用过滤器来完成此操作,但希望查看是否有人有其他建议。
我继续对jsFiddle中要完成的工作创建了一个大概的想法,请注意,右侧的textArea在那里显示了我要触发的点击处理程序。之所以有效,是因为它上面没有另一层。左边的textArea是我当前所在的位置。
最佳答案
这是通过研究以下SO项目并更新处理程序的逻辑来解决的。
how-can-i-wrap-the-previous-current-and-next-word-inside-a-tag-using-jquery
how-to-have-transparent-fonts-except-for-the-text-caret-in-a-textarea