Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 74735

JQuery remove the full link when click at the end of the text

$
0
0

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&amp;source=gmail&amp;ust=1577810994184000&amp;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/&amp;source=gmail&amp;ust=1577810994184000&amp;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.


Viewing all articles
Browse latest Browse all 74735

Latest Images

Trending Articles



Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>