首頁 > web前端 > css教學 > 如何一鍵選擇DIV內的所有文字?

如何一鍵選擇DIV內的所有文字?

Patricia Arquette
發布: 2024-12-11 10:22:21
原創
769 人瀏覽過

How to Select All Text Within a DIV with One Click?

只需點擊滑鼠即可輕鬆選擇DIV 文字

為了快速方便地進行文字操作,通常需要突出顯示並選擇整個內容DIV 標籤的。這使用戶可以輕鬆執行操作,例如拖曳選定的文字或右鍵單擊複製它。

如何實現此目的:

要實現此目的,我們可以利用 JavaScript 函數,該函數利用瀏覽器的選擇功能。它的運作原理如下:

程式碼片段:

function selectText(containerid) {
    if (document.selection) { // IE
        var range = document.body.createTextRange();
        range.moveToElementText(document.getElementById(containerid));
        range.select();
    } else if (window.getSelection) {
        var range = document.createRange();
        range.selectNode(document.getElementById(containerid));
        window.getSelection().removeAllRanges();
        window.getSelection().addRange(range);
    }
}
登入後複製

實作:

在您的HTML 中,包含以下內容用於選擇具有ID 的DIV元素內的文字的程式碼"selectable":

<div>
登入後複製

當使用者點擊此 DIV 中的任意位置時,將執行上述 JavaScript 函數,突出顯示其所有內容。這使得操作文字變得非常容易,無需手動選擇。

以上是如何一鍵選擇DIV內的所有文字?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板