I am working on jquery to remove the link. I need some help with my code because I am having a hard time to remove the link when I click at the end of the text and click on a button to remove the full link in the same line.
When I try this:
else if (window.getSelection().getRangeAt(0))
{
document.execCommand('unlink', false, selected_text);
}
It will not remove the link unless I have to highlight on the text and click on a button to remove the link.
Here is the full code:
$(document).on('click', '#toolbar_unlink', function(e) {
e.preventDefault();
var selected_text = window.getSelection() ? "" + window.getSelection() : document.selection.createRange().text;
if (selected_text) {
document.execCommand('unlink', false, selected_text);
}
else if (window.getSelection().getRangeAt(0))
{
selected = window.getSelection().getRangeAt(0).endContainer.wholeText;
console.log(window.getSelection().getRangeAt(0));
document.execCommand('unlink', false, selected_text);
//clearSelection();
}
});
When I highlight on the text and click on the button, it will remove the link with no problem. So I when I click at the end of the text and click on the button, it will not remove the full link.
However, when I click at the end of the text I will get the full text Video Here 2
without the link.
Here is the html:
<div id="text_editor" class="editor_message" hidefocus="false" aria-label="Message Body" g_editable="true" role="textbox" aria-hidden="true" aria-multiline="true" contenteditable="true" tabindex="1" style="direction: ltr; height: 500px; width: 100%; padding-left: 25px; padding-top: 18px; font-size: 16px; border-bottom: 1px solid #d1d1d1; border-right: 1px solid #d1d1d1; border-left: 1px solid #d1d1d1; overflow-y: auto;" itacorner="6,7:1,1,0,0">
<div><a href="https://www.youtube.com/watch?v=dHyIq3boCu0" target="_blank" data-saferedirecturl="https://www.google.com/url?q=https://www.youtube.com/watch?v%3DdHyIq3boCu0&source=gmail&ust=1577810994184000&usg=AFQjCNFaXvqSKIPAwOUGOicDn-cMTWvW_w">Video Here 1!</a></div>
<div><a href="http://www.google.com/" target="_blank" data-saferedirecturl="https://www.google.com/url?q=http://www.google.com/&source=gmail&ust=1577810994184000&usg=AFQjCNEaLRLcUmjjRiAPYptws9xd7P5A5w">Video Here 2!</a></div><div></div>
</div>
I cant find a way for a solution how to remove the link using document.execCommand function even I have tried everything and I have got no luck.
Can you please show me an example how I can remove the link when I click at the end of the text and click on a button to remove the link?
Thank you.