How do you click text inside a hyperlink to drag and select it?

Question

If you have a paragraph of plain text, you can click anywhere in the text and drag to select it. However, if the text is inside the anchor / link tag, it will not allow you to click and drag - the link will catch the mouse and prevent it.

To understand what I mean, find the text link on this page and try clicking inside and dragging it to select it. This will not allow you - you will have to click the link and drag it.

What do you need to do in JavaScript / JQuery to temporarily disable a link long enough to drag and select it?

The reason I can’t just start outside the link is because every word in the paragraph is in a hyperlink - this is a transcript of the video, and each link is synchronized with the video segment.

Answer 1

My first thought was to do something like this:

$("a").each(function() {
   $(this).replaceWith("<span class='link' data-href='" + $(this).attr("href") + "'>" + $(this).text() + "</span>"); 
});
$(".link").click(function() {
   window.location = $(this).data("href"); 
});

However, there may be a much better way to do this. The above code converts all the elements ainto elements span, storing the attribute value href, and then makes the elements spanwith the link function of the class as links. You could style the elements spanto look like the elements athat are currently running on your page.

.

Answer 2

, .

. .

visibiltiy = 'hidden', , ?

, .