ハイパーリンクの中にあるテキストをクリックしてドラッグしてハイライト表示する方法はありますか？

Question

通常のテキストの段落がある場合は、テキスト内の任意の場所をクリックしてマウスをドラッグして強調表示できます。ただし、テキストがアンカー/リンクタグ内にある場合は、クリックしてドラッグすることはできません。リンクはマウスを捕まえて、それが起こらないようにします。

このページのテキストリンクを見つけて、その中をクリックしてドラッグして選択します。それはあなたに許されません - あなたはリンクの外側をクリックし、その周りをドラッグする必要があります。

JavaScript/JQueryで、リンクをドラッグしてハイライトするのに十分な時間、リンクを一時的に無効にするには、何をする必要がありますか？

私がリンクの外で始めることができない理由は、段落内のすべての単語がハイパーリンク内にあるためです。これは動画のトランスクリプトであり、各リンクは動画のセグメントに同期されます。ただし、これを行うためのより良い方法があるかもしれません

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

：

Answer 1

私が最初に考えたのは、このような何かをすることでした。上記のコードでは、すべてのa要素をhref属性値のままでspan要素に変換してから、クラス「link」を持つ要素spanをリンクとして機能させています。 span要素のスタイルを変更して、現在a要素がページ上に表示されているようにすることができます。

ここには上記の動作のexampleがあります。

Answer 2

this solutionを試して、元のテキストを変数に読み込んで復元することができます。

しかし、それはあまりにも面倒です。場合によっては、より単純な解決策が良い場合もあります。

2つの段落を持たず、ユーザーがボタンをクリックしてリンク付きの段落を非表示にし、リンクなしで段落を表示すると、visibiltiy = 'hidden'に設定されます。

動画を読み込んでいるため、ページの重さが問題にはならないようです。