你如何标记/突出显示文本/字母,就像在 Word 或 PDF 文件中一样,但现在在 PHP 和 jquery 中


how do you mark/highlight text/letters, just like in word or a PDF-file but now in PHP and jquery?

你如何标记文本/字母,就像在单词或PDF文件中一样?

我正在尝试创建一个练习,人们必须标记一个单词或一些字符。
例如

<h3>find the number in this sentence</h3>
<p>I like the movie Moneyball</p>

溶液:

<h3>find the number in this sentence</h3>

I like the movie M一个yball


  • 对于每个练习,您都知道问题,句子和答案。
  • 我想要的是,你选择的单词的值
    • 如果你
    • 选择一个单词或一些字母(取决于你何时松开鼠标按钮),那就太好了,背景颜色会变成绿色(下一次,上一个标记会消失并重新开始......

我想在jquery -->.selectet()上,但是有这么多的信息,我没有任何经验。

欢迎所有帮助,

亲切问候

你可以使用这个jQuery Selectable插件

我个人会将您要突出显示的文本包装在 span 标签中,并设置跨度的背景颜色:

Your text and the <span class="highlight">text you want to highlight</span>

澄清...我会用跨度预先包装"正确"区域并附加一个单击事件,以便您可以检测何时选择它。这样,您可以轻松检测到他们何时单击正确的位置并从那里开始工作。

如果您想以不同的方式执行此操作,则可以设置输入元素的样式,使其看起来像常规文本,然后使用其中的选择信息。您应该能够将值字符串放入内存中,并使用选择信息对他们选择的部分进行子串。

我把这当作个人挑战,因为我可以想象很多用途。这是一个简单的要点,将所有单词拆分为 dom 元素,并跟踪它之前和之后的单词。