我有两个文本区域。 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

09-29 20:20