0

I want an interaction that allows the user to first select a cursor tool, and then use it to select some text and apply a distinct attribute to it, select another cursor tool, apply a different attribute to another part, and then submit the selection/ attribute data. A use case would be an interaction where the user must identify the subject, verb and complement of a displayed sentence using three different cursor/attribute tools. The end result would be something like this but any attribute would do as long as it is distinct. The text itself should not be editable. When done the user would submit and their selections evaluated. 

<p><span style="background-color:lightseagreen;">The fox</span> <span style="background-color:pink;">jumped</span> <span style="background-color:yellow;">over the fence.</span></p>

Is this possible?

A more complex example with more complex syntax would require the student to identify the core structure in bold and then identify the complete S,V and C.

<p><span style="background-color:lightseagreen;"><b>The fox</b> with the broken foot</span> <span style="background-color:pink;"><b>jumped</b> painfully</span> <span style="background-color:yellow;"><b>over the fence.</b></span></p>
Ubu English
  • 101
  • 2
  • You can use [window.getSelection()](https://developer.mozilla.org/en-US/docs/Web/API/Window/getSelection). But checking the correctness of answers will be very complicated and error prone, since you can select a part of a word, like a single letter. – Dmitry Nov 06 '17 at 13:44
  • I think window.getSelection only returns the text string. I also want the attribute values of the variously selected text. – Ubu English Nov 06 '17 at 16:03

0 Answers0