Highlighting text using JavaScript

Question

I want to highlight text with custom color after selecting text using a mouse, and also want to save it in the database corresponding to the user. Can anyone help me by giving me some idea or library?

Answer 1

1. This type of feature is built into HTML, by using the <mark> tag. Hence, you don't need a library, and can custom build it. You can do inline styling to give it the custom background color from the database, and even change the text color.

• Using jquery event listeners, you can also detect selection events to apply this highlighted style.
• You can read more about this tag here: https://www.w3schools.com/tags/tag_mark.asp

2. If you're set on using a library the following is pretty neat: https://markjs.io

Let me know if this helps :)

Answer 2

The code will be here in jquery. . To change the color you can use onmouseover onclick onchange event ex:

<script>
$(document).ready(function(){
$(".your_text_class").onmouseover(function(){
$(this).css("background-color","white":"color","Black");
var isStore = $(this).attr("isStore");
if(!isStore){
$.ajax({
//here your can use the ajax to save your value to database
})
}
$(this).attr("isStore",1);
})
})
<script>

I used this $(this).attr("isStore",1); to store value once in the database if not used then it will run every time when user mouseover on text Thanks.