Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Menghalang Pemilihan Teks pada Halaman HTML Saya?

Bagaimanakah Saya Boleh Menghalang Pemilihan Teks pada Halaman HTML Saya?

Patricia Arquette
Patricia Arquetteasal
2024-12-29 13:20:10524semak imbas

How Can I Prevent Text Selection on My HTML Pages?

Mencegah Pemilihan Teks pada Halaman HTML

Soalan:

Untuk meningkatkan UI sesuatu Halaman HTML, bagaimana elemen teks, seperti nama tab, boleh dibuat tidak boleh dipilih untuk mengelakkan tidak disengajakan menyerlahkan?

Penyelesaian CSS/HTML:

Merentasi kebanyakan penyemak imbas, CSS berikut boleh digunakan:

*.unselectable {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;

   -ms-user-select: none;
   user-select: none;
}

Untuk elemen yang tidak warisi harta ini, seperti dalam IE < 10 dan Opera, atribut yang tidak boleh dipilih boleh ditambah terus kepada elemen yang dikehendaki:

<div>

Penyelesaian JavaScript:

Sebagai alternatif rekursif untuk menambah atribut yang tidak boleh dipilih secara manual untuk setiap elemen dalam bekas, JavaScript boleh digunakan:

function makeUnselectable(node) {
    if (node.nodeType == 1) {
        node.setAttribute("unselectable", "on");
    }
    var child = node.firstChild;
    while (child) {
        makeUnselectable(child);
        child = child.nextSibling;
    }
}

makeUnselectable(document.getElementById("foo"));

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghalang Pemilihan Teks pada Halaman HTML Saya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn