1

你如何标记文本/字母，就像在 word 或 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() 但是信息太少了，我对此没有任何经验。

欢迎所有帮助，

亲切的问候

4

3 回答 3

1

你可以使用这个jQuery Selectable插件

于 2012-04-25T20:49:41.140 回答
0

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

于 2012-04-25T21:33:06.033 回答
0

我个人会将要突出显示的文本包装在跨度标记中，并设置跨度的背景颜色：

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

为了澄清......我会用跨度预先包装“正确”区域并附加一个点击事件，以便您可以检测到它何时被选中。这样您就可以轻松地检测到他们何时点击了正确的位置并从那里开始工作。

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

于 2012-04-25T20:47:04.133 回答