如何單擊超鏈接內的文本以便拖動並突出顯示它？

Question

如果您有一段普通文本，您可以單擊文本內的任意位置並拖動鼠標以突出顯示它。 但是，如果文本位於錨點/鏈接標簽內，則不允許您單擊和拖動 - 鏈接會抓住鼠標並阻止它發生。

要了解我的意思，請在此頁面上找到一個文本鏈接，然后嘗試在其中單擊並拖動到 select 它。 它不會讓你 - 你必須點擊鏈接外部並拖動它。

您需要在 JavaScript/JQuery 中做些什么來暫時禁用鏈接足夠長的時間以便您拖動和突出顯示它？

我不能只在鏈接之外開始的原因是因為段落中的每個單詞都在一個超鏈接內——它是一個視頻腳本，每個鏈接都同步到視頻中的一個片段。

Answer 1

我的第一個想法是做這樣的事情：

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

但是，可能有更好的方法來做到這一點。 上面的代碼將所有a元素轉換為span元素，保留href屬性值，然后將span元素與class“鏈接”function作為鏈接。 您可以設置span元素的樣式，使其看起來像頁面上當前a元素。

這是上面的一個例子。

Answer 2

您可以嘗試此解決方案，將原始文本加載到變量中，然后恢復它們。

但這似乎太混亂了。 有時更簡單的解決方案會更好。

當用戶單擊按鈕以隱藏帶有鏈接的段落並顯示不帶鏈接的段落時，為什么不設置兩個段落並設置 visibiltiy='hidden'？

頁面重量似乎不是問題，因為無論如何您都在加載視頻。