使用JavaScript讀取所選文本并將其復(fù)制到剪貼板

詢問大多數(shù)開發(fā)人員如何將用戶選擇的內(nèi)容復(fù)制到剪貼板，他們會提到Flash的需求（因此 Zeroclipboard等腳本的流行）。然而，這種想法的調(diào)整現(xiàn)在歸功于最近瀏覽器對JavaScript中關(guān)鍵技術(shù)的支持的改進，這使得復(fù)制到剪貼板本身成為可能。這種JavaScript方法在IE9 +，F(xiàn)irefox 41+和Chrome 42+中得到支持，最終為瀏覽器本身帶來了原生剪切/復(fù)制支持。在本教程中，我們將看到如何閱讀用戶選擇的文本內(nèi)容，動態(tài)選擇頁面上的一些文本，最后但并非最不重要的是，將所選內(nèi)容復(fù)制到剪貼板，所有這些都只使用JavaScript。我們現(xiàn)在正進入無Flash區(qū)域！ document.execCommand()

我們提供的服務(wù)有：成都做網(wǎng)站、成都網(wǎng)站制作、微信公眾號開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認證、大余ssl等。為上1000家企事業(yè)單位解決了網(wǎng)站和推廣的問題。提供周到的售前咨詢和貼心的售后服務(wù)，是有科學(xué)管理、有技術(shù)的大余網(wǎng)站制作公司

檢索用戶選擇的文本內(nèi)容

讓我們從頂部開始，檢索用戶在頁面上選擇的內(nèi)容，直到任何文本內(nèi)容。為此，我們使用了所有現(xiàn)代瀏覽器和IE9 +支持的方法： window.getSelection()

五

"vertical-align: inherit;">"vertical-align: inherit;">function getSelectionText（）{"vertical-align: inherit;">"vertical-align: inherit;">

var selectedText =“”"vertical-align: inherit;">"vertical-align: inherit;">

if（window.getSelection）{//所有現(xiàn)代瀏覽器和IE9 +

selectedText = window.getSelection（）。toString（）"vertical-align: inherit;">"vertical-align: inherit;">

}"vertical-align: inherit;">"vertical-align: inherit;">

返回selectedText"vertical-align: inherit;">"vertical-align: inherit;">

}

window.getSelection()返回頁面上當前選定的文本，并返回包含該數(shù)據(jù)的對象。要檢索實際文本，我們使用它將其轉(zhuǎn)換為字符串。以下示例在用戶將鼠標懸停在文檔上時調(diào)用我們的函數(shù)，以便查看用戶選擇的內(nèi)容（如果有）： SelectiontoString()getSelectionText()

五

"vertical-align: inherit;">"vertical-align: inherit;">document.addEventListener（'mouseup'，function（）{"vertical-align: inherit;">"vertical-align: inherit;">

var thetext = getSelectionText（）"vertical-align: inherit;">"vertical-align: inherit;">

if（thetext.length> 0）{//檢查是否選擇了一些文本

console.log（thetext）//記錄用戶在頁面上選擇的任何文本內(nèi)容

}"vertical-align: inherit;">"vertical-align: inherit;">

}，false）

我們首先檢查是否選擇了一些文本，就像用戶只是單擊頁面一樣，沒有。

選擇并讀取頁面上非表單元素的文本內(nèi)容

繼續(xù)前進，我們還可以負責(zé)并動態(tài)選擇然后在頁面上檢索我們想要的內(nèi)容，而不是簡單地檢索用戶選擇的內(nèi)容，例如特定DIV的內(nèi)容。這與簡單地使用元素innerHTML或 innerText屬性來獲取其內(nèi)容非常不同; 我們希望通過JavaScript 實際選擇該內(nèi)容，這會打開其他可能的操作，例如將其復(fù)制到用戶的剪貼板。

要選擇非表單字段元素的文本內(nèi)容，我們首先創(chuàng)建一個新的 Range對象并將其設(shè)置為包含所需的元素。然后，將范圍添加到Selection對象以實際選擇它。讓我們看看它是如何工作的，這個函數(shù)根據(jù)傳入元素的元素動態(tài)選擇元素的文本內(nèi)容：

五

"vertical-align: inherit;">"vertical-align: inherit;">function selectElementText（el）{"vertical-align: inherit;">"vertical-align: inherit;">

var range = document.createRange（）//創(chuàng)建新的范圍對象

range.selectNodeContents（el）//設(shè)置范圍以包含所需的元素文本

var selection = window.getSelection（）//從當前用戶選擇的文本中獲取Selection對象

selection.removeAllRanges（）//取消選擇任何用戶選擇的文本（如果有）

selection.addRange（range）//為Selection對象添加范圍以選擇它

}

要創(chuàng)建一個用于添加范圍的對象，我們使用; 因為默認情況下此方法會返回用戶選擇的文本（如果有的話），所以我們會立即調(diào)用其方法來清除平板。然后，我們開始創(chuàng)建一個空白范圍，將元素的內(nèi)容歸零以選擇使用，然后將該范圍添加到對象中以進行選擇。 Selection window.getSelection()removeAllRanges() range.selectNodeContents() Selection

一旦我們選擇了我們想要閱讀的文本，我們就轉(zhuǎn)向我們之前的getSelectionText()方法來讀取所選元素的內(nèi)容，例如：

演示：

“我的媽媽總是說，'生活就像一盒巧克力。你永遠不會知道你會得到什么。'” - Forrest

選擇并檢索文本

代碼：

"vertical-align: inherit;">"vertical-align: inherit;">var para = document.getElementById（'para'）"vertical-align: inherit;">"vertical-align: inherit;">

selectElementText（para）//選擇我們希望閱讀的元素文本

var paratext = getSelectionText（）//讀取用戶選擇

alert（paratext）//提醒“我的媽媽總是說...”

選擇和讀取表單元素的內(nèi)容，如INPUT文本或TEXTAREA

為了選擇和讀取表格相關(guān)的字段值，例如INPUT文本和TEXTAREA，該過程不同于選擇常規(guī)文本。我們大多數(shù)人已經(jīng)知道選擇表單字段的整個值，我們可以使用 inputElement.select()*，并檢索該值，探測 inputElement.value。但是，還可以通過編程方式選擇字段值的一部分并獲取該值。讓我們看看如何做到這一點。

- 以編程方式選擇字段值的一部分

要動態(tài)選擇INPUT文本或TEXTAREA元素的一部分，請使用此字段指示所需選擇的起始和結(jié)束索引： formElement.setSelectionRange()

"vertical-align: inherit;">"vertical-align: inherit;">var emailfield = document.getElementById（“email”）"vertical-align: inherit;">"vertical-align: inherit;">

emailfield.focus（）//在setSelectionRange（）工作之前，這在大多數(shù)瀏覽器中都是必需的

emailfield.setSelectionRange（0,5）//選擇輸入字段的前5個字符

emailfield.setSelectionRange（5，emailfield.value.length）//選擇輸入字段的第5個到最后一個字符

請注意，第二個參數(shù) formElement.setSelectionRange()應(yīng)該是要選擇的結(jié)束字符的索引加1，因此要選擇表單字段的前5個字符，要輸入的結(jié)束索引值應(yīng)為5或4（第5個字符的索引））加1。

演示：

選擇前5個字符選擇第5個到最后一個字符

*注意：在iOS設(shè)備中（從iOS9開始），使用inputElement.select()快速選擇所有表單元素的內(nèi)容似乎不起作用。但是，使用inputElement.setSelectionRange()確實。因此，以下選擇跨瀏覽器和設(shè)備的所有表單字段的文本：

inputElement.setSelectionRange(0, inputElement.value.length)

- 讀取字段值的選定部分

無論如何選擇表單字段的值的一部分，無論是通過使用setSelectionRange()動態(tài)選擇該部分，還是用戶拖動他/她的鼠標來進行用戶定義的選擇，檢索選擇的方法是獲取指數(shù)選擇的開始和結(jié)束字符，然后使用它們從表單字段的值中提取該部分。我們可以使用以下方法獲取活動選擇的索引：

formElement.selectionStart：所選文本的第一個字符的索引。如果未選擇任何文本，則它包含輸入光標后面的字符的索引。
formElement.selectionEnd：所選文本的最后一個字符的索引。如果未選擇任何文本，則它包含輸入光標后面的字符的索引。

上述屬性對于從表單字段中獲取任何用戶選定文本特別有用，其中選擇的索引尚不為人所知。以下演示回應(yīng)了用戶使用以下屬性從TEXTAREA中選擇的內(nèi)容：

演示（在textarea中選擇一些文本）：

輸出：

代碼：

五

"vertical-align: inherit;">"vertical-align: inherit;"><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>這里有一些文字<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code></ textarea>的</code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code><div class="squ6kqw" id =“output”> </ div></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code><SCRIPT></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>var</code> <code>quotearea = document.getElementById（</code><code>'quote'</code><code>）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>var</code> <code>output = document.getElementById（</code><code>'output'</code><code>）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>quotearea.addEventListener（</code><code>'mouseup'</code><code>，</code><code>function</code><code>（）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>if</code><code>（</code><code>this</code><code>.selectionStart！= </code><code>this</code><code>.selectionEnd）{</code><code>//檢查用戶是否在字段內(nèi)選擇了一些文本</code> <code> </code><code>var</code> <code>selectedtext = </code><code>this</code><code>.value.substring（</code><code>this</code><code>.selectionStart，</code><code>this</code><code>.selectionEnd）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>output.innerHTML = selectedtext<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>}，</code><code>false</code><code>）</code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code></ SCRIPT></code> </td></tr></tbody></table>我們<code>mouseup</code>在目標TEXTAREA上附加一個“ ”事件，以便在用戶將其置于其中時進行監(jiān)聽。在事件處理函數(shù)內(nèi)部，為了檢測用戶選擇的內(nèi)容，首先，我們檢查TEXTAREA <code>selectionStart</code> 和<code>selectionEnd</code>屬性是否包含不同的值 - 如果它們相同，則表示沒有選擇任何內(nèi)容，在這種情況下它們都指向輸入光標后面的字符。如果它們的值不同，我們繼續(xù)將選定文本的索引映射到表單字段值的值，以使用導(dǎo)出實際選定的文本<code> formElement.value.substring()</code>。<h4>將所選文本復(fù)制到用戶剪貼板</h4>好了，現(xiàn)在關(guān)于如何閱讀頁面上所選內(nèi)容的細節(jié)，無論是在頁面上，還是在特定的DIV或表單元素內(nèi)，我們都可以繼續(xù)下一個緊迫的問題，實際上是復(fù)制那個內(nèi)容到剪貼板。正如本教程開頭所提到的，它歸結(jié)為使用該方法執(zhí)行命令以“復(fù)制”（或“剪切”）文本到剪貼板：<code> document.execCommand()</code> <trl></trl> <table class="cke_show_border" width="NaN"><tbody><tr><td width="NaN">1234五6789</td><td width="1690"><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code><code>function</code> <code>copySelectionText（）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>copysuccess </code><code>// var檢查execCommand是否成功執(zhí)行</code> <code> </code><code>嘗試{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>copysuccess = document.execCommand（“copy”）</code><code>//運行命令將所選文本復(fù)制到剪貼板</code> <code> </code><code>} </code><code>catch</code><code>（e）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>copysuccess = </code><code>false</code><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>返回copysuccess<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>}</code> </td></tr></tbody></table>這里的關(guān)鍵是行<code>document.execCommand("copy")</code>，它實際上執(zhí)行動作以將頁面上當前選擇的任何內(nèi)容復(fù)制到剪貼板。為了檢測瀏覽器是否<code>execCommand()</code> 正確支持該方法，我們將操作放在一個<code>try/catch()</code>塊中; 如果調(diào)用<code>execCommand()</code>失敗，我們知道瀏覽器不支持此方法。我們可以使用我們的新變形<code>copySelectionText()</code>函數(shù)與任何以前的方法來選擇/檢索一些文本然后將其復(fù)制到剪貼板。例如，當用戶將鼠標懸停在文檔上時，下面的代碼段將復(fù)制用戶在頁面上選擇的任何內(nèi)容：<trl></trl> <table class="cke_show_border" width="NaN"><tbody><tr><td width="NaN">123</td><td width="1880"><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>>document.body.addEventListener（</code><code>'mouseup'</code><code>，</code><code>function</code><code>（）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>copysuccess = copySelectionText（）</code><code>//將用戶選定的文本復(fù)制到剪貼板</code> <code>}，</code><code>false</code><code>）</code> </td></tr></tbody></table>我們可以改進這個過程，但如果用戶選擇實際上包含一些數(shù)據(jù)，則只執(zhí)行“復(fù)制”操作; 例如，如果用戶只是單擊頁面而不突出顯示任何內(nèi)容，則不會選擇任何數(shù)據(jù)，在這種情況下，應(yīng)該中止復(fù)制操作。這可以通過預(yù)先查看用戶選擇的內(nèi)容來完成：<trl></trl> <table class="cke_show_border" width="NaN"><tbody><tr><td width="NaN">1234五6</td><td width="3112"><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>>document.body.addEventListener（</code><code>'mouseup'</code><code>，</code><code>function</code><code>（）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>selected = getSelectionText（）</code><code>//調(diào)用<a href="#getselectiontext">getSelectionText（）</a>以查看所選內(nèi)容</code> <code> </code><code>if</code><code>（selected.length> 0）{</code><code>//如果所選文本長度大于0</code> <code> </code><code>var</code> <code>copysuccess = copySelectionText（）</code><code>//將用戶選定的文本復(fù)制到剪貼板</code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>}，</code><code>false</code><code>）</code> </td></tr></tbody></table>現(xiàn)在是現(xiàn)場演示的時候了。嘗試選擇以下段落中的任何文本，以查看其內(nèi)容復(fù)制到剪貼板（之后按“Ctrl V”進行粘貼和確認）。我還添加了一個臨時顯示的工具提示，表示每次都成功：演示（選擇下面段落中的任何文本將其復(fù)制到剪貼板）： “為了享受健康，為家人帶來真正的幸福，為所有人帶來和平，首先必須訓(xùn)練和控制自己的思想。如果一個人可以控制自己的思想，他就能找到通往啟蒙的道路，以及所有的智慧和美德他自然會來找他?！?nbsp;-佛代碼： <trl></trl> <table class="cke_show_border" width="NaN"><tbody><tr><td width="NaN">1234五6789</td><td width="2288"><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>>createtooltip（）</code><code>//通過每頁調(diào)用ONCE來創(chuàng)建工具提示。請參閱下面的“注釋”</code> <code>var</code> <code>buddhaquote = document.getElementById（</code><code>'buddhaquote'</code><code>）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>buddhaquote.addEventListener（</code><code>'mouseup'</code><code>，</code><code>function</code><code>（e）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>selected = getSelectionText（）</code><code>//調(diào)用getSelectionText（）以查看所選內(nèi)容</code> <code> </code><code>if</code><code>（selected.length> 0）{</code><code>//如果所選文本長度大于0</code> <code> </code><code>var</code> <code>copysuccess = copySelectionText（）</code><code>//將用戶選定的文本復(fù)制到剪貼板</code> <code> </code><code>showtooltip（e）中<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>}，</code><code>false</code><code>）</code> </td></tr></tbody></table>注意： 單擊此處獲取工具提示功能的來源。<h4>將選定的表單字段值復(fù)制到用戶剪貼板</h4>繼續(xù)，我們可以輕松地對表單字段值執(zhí)行相同的帽子技巧。在下一個示例中，我們在INPUT文本字段旁邊添加一個控件，以便用戶快速復(fù)制其值：演示： 分享本教程復(fù)制代碼： <trl></trl> <table class="cke_show_border" width="NaN"><tbody><tr><td width="NaN">1234五678910111213141516171819</td><td width="1742"><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>><SCRIPT></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>function</code> <code>copyfieldvalue（e，id）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>field = document.getElementById（id）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>field.focus（）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>field.setSelectionRange（0，field.value.length）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>copysuccess = copySelectionText（）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>if</code><code>（copysuccess）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>showtooltip（e）中<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>}</code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code></ SCRIPT></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code><fieldset style =“max-width：600px”><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code><legend>分享本教程</ legend><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code><input id =“url”type =“text”size =“60”value =“http:</code><code>//www.javascriptkit.com/javatutors/copytoclipboard.shtml”/> </code> <code> </code><code><a href=</code><code>"#"</code> <code>onClick=</code><code>"copyfieldvalue(event,'url');return false"</code><code>>復(fù)制</a><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code></字段集></code> </td></tr></tbody></table><h4>將DIV的內(nèi)容復(fù)制到剪貼板</h4>最后，為了更好的衡量，我們還可以看到一個例子，點擊它時自動選擇并將DIV的內(nèi)容復(fù)制到剪貼板：演示（點擊下面的任何引號選擇其內(nèi)容）： “就在毛毛蟲認為世界即將結(jié)束時，他變成了一只蝴蝶?！? 諺語“偉大的頭腦討論想法;平均思想討論事件;小思想討論人?！?nbsp;- 埃莉諾羅斯福“沒有你的同意，任何人都不會讓你感到自卑?！?nbsp;- 埃莉諾羅斯福代碼： <trl></trl> <table class="cke_show_border" width="NaN"><tbody><tr><td width="NaN">1234五67891011121314151617181920212223242526272829三十31</td><td width="1964"><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>><div class="squ6kqw" id =“motivatebox”style =“overflow：hidden; margin：1em auto”><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code><div id="squ6kqw" class =“motivate”><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>“就在毛毛蟲認為世界即將結(jié)束時，他變成了一只蝴蝶。” <code>"vertical-align: inherit;"</code><code>> - 諺語<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code></ DIV></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code><div id="squ6kqw" class =“motivate”><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>“偉大的頭腦討論想法;平均思想討論事件;小思想討論人?！?<code>"vertical-align: inherit;"</code><code>> - 埃莉諾羅斯福<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code></ DIV></code> <code> </code><code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code><div id="squ6kqw" class =“motivate”><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>“沒有你的同意，任何人都不會讓你感到自卑。” <code>"vertical-align: inherit;"</code><code>> - 埃莉諾羅斯福<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code></ DIV><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code></ DIV></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code><SCRIPT></code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>var</code> <code>motivatebox = document.getElementById（</code><code>'motivatebox'</code><code>）</code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>motivatebox.addEventListener（</code><code>'mouseup'</code><code>，</code><code>function</code><code>（e）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>var</code> <code>e = e || <code>"vertical-align: inherit;"</code><code>>event </code><code>//在現(xiàn)代和舊版IE瀏覽器之間均衡事件對象</code> <code> </code><code>var</code> <code>target = e.target || <code>"vertical-align: inherit;"</code><code>>e.srcElement </code><code>//獲取目標元素鼠標結(jié)束</code> <code> </code><code>if</code><code>（target.className ==</code><code>'motivate'</code><code>）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>selectElementText（target）</code><code>//選擇我們想要閱讀的元素文本</code> <code> </code><code>var</code> <code>copysuccess = copySelectionText（）<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>if</code><code>（copysuccess）{<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>showtooltip（e）中<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code> </code><code>}<code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code>}，</code><code>false</code><code>）</code> <code><code>"vertical-align: inherit;"</code><code>><code>"vertical-align: inherit;"</code><code>></code> <code></ SCRIPT></code> </td></tr></tbody></table>這里沒什么新東西 - 我們只是監(jiān)視<code>mouseup</code>引號DIVs共享父容器的“ ”事件，以檢測用戶何時點擊其中一個內(nèi)部DIV。當發(fā)生這種情況時，我們選擇DIV的內(nèi)容，然后使用之前創(chuàng)建的函數(shù)將其復(fù)制到剪貼板。<h4>結(jié)論是</h4>正如您所看到的，閱讀，更重要的是，將文本復(fù)制到剪貼板現(xiàn)在可以完全是JavaScript事件。隨著Flash不再受瀏覽器和用戶的青睞，這確實是個好消息。以上所有示例均適用于IE9 +，F(xiàn)irefox 41+和Chrome 42+。 當前名稱：使用JavaScript讀取所選文本并將其復(fù)制到剪貼板 標題路徑：<a href="http://weahome.cn/article/ipcphc.html">http://weahome.cn/article/ipcphc.html</a> </div> </div> </div> <div id="squ6kqw" class="other container"> <h3>其他資訊</h3> <ul> <li> <a href="/article/pjgcge.html">SpringBoot部署在tomcat容器中運行的部署方法</a> </li><li> <a href="/article/pjgccp.html">你不知道的BAT大數(shù)據(jù)面試題</a> </li><li> <a href="/article/pjgcej.html">如何使用Css3實現(xiàn)炫酷的打字動畫</a> </li><li> <a href="/article/pjgcgg.html">詳解nginx模塊使用方法</a> </li><li> <a href="/article/pjgcgh.html">Python學(xué)習(xí)—pyhton中的進程</a> </li> </ul> </div> <div id="squ6kqw" class="footer"> <div id="squ6kqw" class="foota container"> <div id="squ6kqw" class="foot_nav fl col-lg-8 col-md-8 col-sm-12 col-xs-12"> <ul> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>網(wǎng)站制作</h3> <a target="_blank">成都網(wǎng)站制作</a><a target="_blank">成都網(wǎng)站制作</a><a target="_blank">成都網(wǎng)站制作</a><a target="_blank">網(wǎng)站制作價格</a><a target="_blank">成都營銷網(wǎng)站制作</a><a target="_blank">成都網(wǎng)站制作</a> </li> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>企業(yè)服務(wù)</h3> <a target="_blank">成都網(wǎng)站維護</a><a target="_blank">網(wǎng)站備案</a><a target="_blank">免費建站</a><a target="_blank">400電話</a><a target="_blank">一元廣告</a><a target="_blank">免費網(wǎng)站建設(shè)</a> </li> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>網(wǎng)站建設(shè)</h3> <a target="_blank">簡陽網(wǎng)站建設(shè)</a><a target="_blank">企業(yè)網(wǎng)站建設(shè)</a><a target="_blank">高端網(wǎng)站建設(shè)</a><a target="_blank">手機網(wǎng)站建設(shè)</a><a target="_blank">商城網(wǎng)站建設(shè)公司</a><a target="_blank">化妝品企業(yè)網(wǎng)站建設(shè)方案</a> </li> <li id="squ6kqw" class="col-lg-3 col-md-3 col-sm-3 col-xs-6"> <h3>服務(wù)器托管</h3> <a target="_blank">成都機柜租用</a><a target="_blank">重慶服務(wù)器托管</a><a target="_blank">綿陽主機托管</a><a target="_blank">成都服務(wù)器托管</a><a target="_blank">服務(wù)器托管機柜</a><a target="_blank">移動服務(wù)器托管</a> </li> </ul> </div> <div id="squ6kqw" class="footar fl col-lg-4 col-md-4 col-sm-12 col-xs-12"> 全國免費咨詢: 400-028-6601 業(yè)務(wù)咨詢：028-86922220 / 13518219792 節(jié)假值班：18980820575 / 13518219792 聯(lián)系地址：成都市太升南路288號錦天國際A幢1002號 </div> </div> <div id="squ6kqw" class="footb"> <div id="squ6kqw" class="copy container"> <div id="squ6kqw" class="fl">Copyright ? 成都創(chuàng)新互聯(lián)科技有限公司重慶分公司 <a target="_blank">渝ICP備2021005571號</a></div>  </div> </div> <div id="squ6kqw" class="link"> <div id="squ6kqw" class="container"> 友情鏈接:： <a target="_blank">成都網(wǎng)站建設(shè)</a> <a target="_blank">重慶網(wǎng)站建設(shè)</a> <a href="">四川網(wǎng)站建設(shè)</a> <a href="">重慶建設(shè)網(wǎng)站</a> <a target="_blank">移動服務(wù)器托管</a> <a target="_blank">成都服務(wù)器托管</a> <a target="_blank">云服務(wù)器</a> <a target="_blank">廣告設(shè)計制作</a> <a target="_blank">重慶網(wǎng)頁設(shè)計</a> <a target="_blank">重慶做網(wǎng)站</a> <a target="_blank">重慶網(wǎng)站制作</a> <a href="">重慶網(wǎng)站建設(shè)</a> <a href="">重慶網(wǎng)站公司</a> <a href="">渝中網(wǎng)站制作</a> <a href="">重慶網(wǎng)站設(shè)計</a> </div> </div> </div> <div id="squ6kqw" class="foot"> <ul class="public-celan"> <li> <a target="_blank" class="a1 db tc"> <img src="/Public/Home/img/icon-23.png" alt="" class="db auto"> 在線咨詢 </a> </li> <li> <a href="tel:18980820575" class="a1 db tc"> <img src="/Public/Home/img/icon-24.png" alt="" class="db auto"> 電話咨詢 </a> </li> <li> <a target="_blank" href="tencent://message/?uin=1683211881&Site=&Menu=yes" class="a1 db tc"> <img src="/Public/Home/img/icon-25.png" alt="" class="db auto"> QQ咨詢 </a> </li> <li> <a target="_blank" href="tencent://message/?uin=532337155&Site=&Menu=yes" class="a1 db tc public-yuyue-up"> <img src="/Public/Home/img/icon-26.png" alt="" class="db auto"> 預(yù)約顧問 </a> </li> </ul> </div> <div id="squ6kqw" class="customer"> <dl class="icon1"> <dt> <a href="tencent://message/?uin=1683211881&Site=&Menu=yes"> <img src="/Public/Home/img/QQ.png" alt=""> 在線咨詢 </a> </dt> </dl> <dl class="icon2"> <dt><img src="/Public/Home/img/weixin.png" alt="">微信咨詢</dt> <dd><img src="/Public/Home/img/ewm.png"></dd> </dl> <dl class="icon3"> <dt><img src="/Public/Home/img/dianhua.png" alt="">電話咨詢</dt> <dd> 028-86922220（工作日） 18980820575（7×24） </dd> </dl> <dl class="icon4"> <dt class="sShow"> <a href="tencent://message/?uin=244261566&Site=&Menu=yes"> <img src="/Public/Home/img/dengji.png" alt="">提交需求 </a> </dt> </dl> <dl class="icon5"> <dt class="gotop"> <a href="#top"> <img src="/Public/Home/img/top.png" alt="">返回頂部 </a> </dt> </dl> </div> <footer> <div class="friendship-link"> 感谢您访问我们的网站，您可能还对以下资源感兴趣： <a href="http://weahome.cn/" title="真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆">真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆</a> <div class="friend-links"> </div> </div> </footer> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body><div id="u8sgu" class="pl_css_ganrao" style="display: none;"><pre id="u8sgu"></pre><noframes id="u8sgu"><ul id="u8sgu"></ul></noframes><dl id="u8sgu"></dl><del id="u8sgu"></del><tr id="u8sgu"><dfn id="u8sgu"><td id="u8sgu"></td></dfn></tr><noframes id="u8sgu"><ul id="u8sgu"></ul></noframes><abbr id="u8sgu"><kbd id="u8sgu"></kbd></abbr><center id="u8sgu"></center><nav id="u8sgu"><kbd id="u8sgu"></kbd></nav><dd id="u8sgu"><th id="u8sgu"><s id="u8sgu"></s></th></dd><button id="u8sgu"></button><dd id="u8sgu"></dd><samp id="u8sgu"></samp><table id="u8sgu"></table><menu id="u8sgu"></menu><nav id="u8sgu"><li id="u8sgu"><acronym id="u8sgu"></acronym></li></nav><option id="u8sgu"></option><object id="u8sgu"></object><samp id="u8sgu"></samp><xmp id="u8sgu"><th id="u8sgu"><s id="u8sgu"></s></th></xmp><pre id="u8sgu"></pre><abbr id="u8sgu"></abbr><delect id="u8sgu"></delect><pre id="u8sgu"><blockquote id="u8sgu"><tfoot id="u8sgu"></tfoot></blockquote></pre><dfn id="u8sgu"><td id="u8sgu"><fieldset id="u8sgu"></fieldset></td></dfn><samp id="u8sgu"></samp><nav id="u8sgu"><li id="u8sgu"><acronym id="u8sgu"></acronym></li></nav><noframes id="u8sgu"></noframes><li id="u8sgu"></li><option id="u8sgu"><del id="u8sgu"><tr id="u8sgu"></tr></del></option><nav id="u8sgu"></nav><bdo id="u8sgu"></bdo><abbr id="u8sgu"></abbr><nav id="u8sgu"></nav><button id="u8sgu"><samp id="u8sgu"><tbody id="u8sgu"></tbody></samp></button><input id="u8sgu"></input><menu id="u8sgu"></menu><dfn id="u8sgu"><td id="u8sgu"><dl id="u8sgu"></dl></td></dfn><center id="u8sgu"></center><pre id="u8sgu"><cite id="u8sgu"></cite></pre><xmp id="u8sgu"><strike id="u8sgu"><s id="u8sgu"></s></strike></xmp><abbr id="u8sgu"></abbr><blockquote id="u8sgu"><dl id="u8sgu"><object id="u8sgu"></object></dl></blockquote><center id="u8sgu"></center><noframes id="u8sgu"><ul id="u8sgu"></ul></noframes><abbr id="u8sgu"><kbd id="u8sgu"></kbd></abbr><tr id="u8sgu"></tr><table id="u8sgu"></table><center id="u8sgu"></center><menu id="u8sgu"><noscript id="u8sgu"><option id="u8sgu"></option></noscript></menu><input id="u8sgu"></input><li id="u8sgu"></li><blockquote id="u8sgu"></blockquote><ul id="u8sgu"></ul><tbody id="u8sgu"></tbody><code id="u8sgu"><tr id="u8sgu"></tr></code><table id="u8sgu"></table><td id="u8sgu"></td><tbody id="u8sgu"></tbody><tr id="u8sgu"><center id="u8sgu"></center></tr><tbody id="u8sgu"></tbody><noframes id="u8sgu"></noframes><delect id="u8sgu"></delect><dfn id="u8sgu"><td id="u8sgu"><fieldset id="u8sgu"></fieldset></td></dfn><abbr id="u8sgu"></abbr><tfoot id="u8sgu"><input id="u8sgu"></input></tfoot><object id="u8sgu"></object><rt id="u8sgu"></rt><input id="u8sgu"></input><dl id="u8sgu"><input id="u8sgu"></input></dl><center id="u8sgu"></center><delect id="u8sgu"></delect><object id="u8sgu"><abbr id="u8sgu"></abbr></object><blockquote id="u8sgu"><tfoot id="u8sgu"><object id="u8sgu"></object></tfoot></blockquote><delect id="u8sgu"><tr id="u8sgu"><rt id="u8sgu"></rt></tr></delect><cite id="u8sgu"><nav id="u8sgu"></nav></cite><center id="u8sgu"><dl id="u8sgu"></dl></center><noscript id="u8sgu"></noscript><th id="u8sgu"><s id="u8sgu"><bdo id="u8sgu"></bdo></s></th><table id="u8sgu"></table><kbd id="u8sgu"></kbd><rt id="u8sgu"></rt><blockquote id="u8sgu"><tfoot id="u8sgu"><object id="u8sgu"></object></tfoot></blockquote><center id="u8sgu"><dd id="u8sgu"><th id="u8sgu"></th></dd></center><tr id="u8sgu"></tr><input id="u8sgu"></input><optgroup id="u8sgu"></optgroup><bdo id="u8sgu"><del id="u8sgu"></del></bdo><th id="u8sgu"></th><abbr id="u8sgu"></abbr><del id="u8sgu"></del><code id="u8sgu"><table id="u8sgu"><tr id="u8sgu"></tr></table></code><strike id="u8sgu"><s id="u8sgu"><bdo id="u8sgu"></bdo></s></strike><td id="u8sgu"></td><abbr id="u8sgu"></abbr><button id="u8sgu"></button><tbody id="u8sgu"></tbody><samp id="u8sgu"></samp><nav id="u8sgu"><kbd id="u8sgu"><acronym id="u8sgu"></acronym></kbd></nav><delect id="u8sgu"><tr id="u8sgu"><rt id="u8sgu"></rt></tr></delect><delect id="u8sgu"><rt id="u8sgu"><kbd id="u8sgu"></kbd></rt></delect><code id="u8sgu"><table id="u8sgu"><tr id="u8sgu"></tr></table></code><table id="u8sgu"></table><pre id="u8sgu"></pre><source id="u8sgu"><cite id="u8sgu"><abbr id="u8sgu"></abbr></cite></source><samp id="u8sgu"></samp><object id="u8sgu"></object><abbr id="u8sgu"></abbr><fieldset id="u8sgu"></fieldset><fieldset id="u8sgu"></fieldset><s id="u8sgu"></s><noframes id="u8sgu"></noframes><pre id="u8sgu"><th id="u8sgu"></th></pre><code id="u8sgu"></code><button id="u8sgu"><samp id="u8sgu"><tbody id="u8sgu"></tbody></samp></button><delect id="u8sgu"></delect><li id="u8sgu"><option id="u8sgu"><xmp id="u8sgu"></xmp></option></li><noscript id="u8sgu"></noscript><dl id="u8sgu"></dl><fieldset id="u8sgu"></fieldset><input id="u8sgu"></input><tbody id="u8sgu"><button id="u8sgu"><samp id="u8sgu"></samp></button></tbody><optgroup id="u8sgu"></optgroup><noframes id="u8sgu"><ul id="u8sgu"><pre id="u8sgu"></pre></ul></noframes><tfoot id="u8sgu"></tfoot><center id="u8sgu"></center><noframes id="u8sgu"></noframes><nav id="u8sgu"><bdo id="u8sgu"><optgroup id="u8sgu"></optgroup></bdo></nav><th id="u8sgu"></th><dd id="u8sgu"><strike id="u8sgu"><blockquote id="u8sgu"></blockquote></strike></dd><center id="u8sgu"></center><center id="u8sgu"><dl id="u8sgu"></dl></center><blockquote id="u8sgu"><tfoot id="u8sgu"></tfoot></blockquote><table id="u8sgu"></table><tfoot id="u8sgu"><object id="u8sgu"></object></tfoot><xmp id="u8sgu"></xmp><fieldset id="u8sgu"></fieldset><bdo id="u8sgu"><del id="u8sgu"></del></bdo><rt id="u8sgu"><fieldset id="u8sgu"><optgroup id="u8sgu"></optgroup></fieldset></rt></div> </html> <script> $(".con img").each(function(){ var src = $(this).attr("src"); //獲取圖片地址 var str=new RegExp("http"); var result=str.test(src); if(result==false){ var url = "https://www.cdcxhl.com"+src; //絕對路徑 $(this).attr("src",url); } }); window.onload=function(){ document.oncontextmenu=function(){ return false; } } </script>

真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

使用JavaScript讀取所選文本并將其復(fù)制到剪貼板

檢索用戶選擇的文本內(nèi)容

選擇并讀取頁面上非表單元素的文本內(nèi)容

選擇和讀取表單元素的內(nèi)容，如INPUT文本或TEXTAREA

選擇和讀取表單元素的內(nèi)容，如INPUT文本或TEXTAREA