如何選擇範圍內的HTML內容

我需要選擇我的HTML內容（如突出顯示的文本，以便我可以複製它）。我想創建一個按鈕，選擇兩個<div>或兩個<p>（真的是任何標籤）之間的所有內容。查看codepen我需要選擇的內容。如何選擇範圍內的HTML內容

我已經發現了一些選擇的想法，但我不知道（有點糊塗）

<input onClick="this.setSelectionRange(0, 9999)" value="Sample Text" /> 
var range = document.createRange(); 
var sel = window.getSelection(); 
range.setStart(el.childNodes[2], 5); 
range.collapse(true);

我希望由兩個標籤來創建範圍。
感謝您的幫助

來源

2014-11-16 bob smitha

http://stackoverflow.com/questions/985272/selecting-text-in-an-element-akin用鼠標突出顯示 –

從Select all DIV text with single mouse click根據丹尼斯，你應該使用

function SelectText(element) { 
if (document.selection) { 
    var range = document.body.createTextRange(); 
    range.moveToElementText(document.getElementById(element)); 
    range.select(); 
} else if (window.getSelection) { 
    var range = document.createRange(); 
    range.selectNode(document.getElementById(element)); 
    window.getSelection().addRange(range); 
} 
}

選擇從名爲element參數元素中的文本。

要確保你可以選擇你的表，你必須把它放在一個<div>：

<div id="foo"> 
<table> 
    ... 
</table> 
</div>

你必須做同樣的事情與任何其他事情

<div id="bar"> 
<p> 
    ... 
</p> 
</div>

然後，您可以選擇該錶帶有此按鈕：

<input type="button" onclick="SelectText(foo)" value="Select table">

而對於其他div S：

<input type="button" onclick="SelectText(bar)" value="Select p">

讓我知道，如果它
編碼愉快:) -Charlie

來源

2014-11-16 16:17:08 Charlie

感謝您的博文我添加了更新的代碼，並不是爲什麼它不工作[codepen]（http://codepen.io/anon/pen/pvoxYQ?editors=101 ） –

鮑勃，我在Firefox 33/Ubuntu 14.04下的本地文件中試過了，可以工作，但CodePen沒有。我不知道是什麼導致了這個問題 – Charlie

@bobsmitha我在這個網站的另一個主題上發現了一個可用的JavaScript。我檢查了這一點，並在Firefox和Chrome中都能正常工作。讓我知道這是否適用於你;）這是一個CodePen-片段：http://codepen.io/anon/pen/gbOQpo – Charlie

如何選擇範圍內的HTML內容

回答

相關問題