Bagaimana Saya Boleh Menghalang Pemilihan Teks dalam HTML?

Teks Tidak Boleh Pilih dalam HTML

Soalan: Dalam UI HTML, adakah mungkin untuk menghalang pengguna daripada memilih tertentu elemen teks, seperti tab nama?

Jawapan:

Ya, terdapat beberapa cara untuk menjadikan teks tidak boleh dipilih dalam HTML:

Menggunakan CSS:

Dalam penyemak imbas moden, ini boleh dicapai dengan CSS menggunakan pilihan pengguna property:

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

Menggunakan Atribut tidak boleh dipilih (IE dan Opera):

Untuk versi lama IE dan Opera, atribut tidak boleh dipilih boleh digunakan pada elemen tertentu :

<div>

Nota: Atribut ini tidak diwarisi, jadi ia mesti dinyatakan untuk setiap elemen yang tidak boleh dipilih.

NyahPilihan Rekursif dengan JavaScript:

Sebagai alternatif, JavaScript boleh digunakan untuk menetapkan atribut tidak boleh dipilih secara rekursif untuk semua keturunan unsur:

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 Bagaimana Saya Boleh Menghalang Pemilihan Teks dalam HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!