Как я могу «нарисовать» маркер на текст?

Question

Я хочу иметь текст, который при перетаскивании текста выделяет текст и сохраняет выделенный текст в переменной.

Я не уверен, где бы я начал с этого, из моих исследований, похоже, что это возможно с html5 и холстом, но я не слишком опытен с html5, поэтому любая помощь очень ценится.

Answer 1

$(document).ready(function() { 
 
    $(document).on('click', function() { 
 
     var selection = ''; 
 
     if (window.getSelection) { 
 
      selection = window.getSelection().toString(); 
 
     } 
 
     else if (document.selection) { 
 
      selection = document.selection.createRange().text; 
 
     } 
 
     $('.highlighted').append(selection + '<br/>'); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
aslkdfjasd thiasldfkjljaslkdjf kasjdlfj lkjasdlkfjl ajsdfll kjlasjdfl laskjdfl lkjasldkfjlakjsdfj;lkjlaksdlfkjl lkjasldkfjl asdfkj jasldjflj asdlkfjalskdjf lkkjasdlklfjlasjdlfkjasdkfjl asdlfjsaf 
 
this is some random text 
 

 
<br/><br/> 
 
The following text was highlighted:<br/> 
 
<div class="highlighted" style="font-weight:bold;"></div>