Bagaimanakah Saya Boleh Lumpuhkan Pemilihan Teks dalam UI HTML Saya?

Lumpuhkan Pemilihan Teks untuk Pengalaman UI Dipertingkat

Apabila mereka bentuk antara muka pengguna HTML, beberapa elemen teks, seperti nama tab, boleh kelihatan tidak diingini apabila dipilih . Untuk mengelakkan ini, pertimbangkan untuk melaksanakan salah satu kaedah berikut.

Penyelesaian CSS

Bagi kebanyakan penyemak imbas, gaya CSS berikut boleh menjadikan teks tidak boleh dipilih:

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

Atribut HTML untuk IE dan Opera

Untuk pelayar seperti IE (di bawah versi 10) dan Opera, gunakan atribut yang tidak boleh dipilih:

<div>
<p><strong>JavaScript Recursion untuk Kawasan Tidak Boleh Dipilih yang Luas</strong></p>
<p>Untuk kes yang melibatkan sarang, gunakan JavaScript untuk menetapkan atribut tidak boleh dipilih secara rekursif:</p>
<pre class="brush:php;toolbar:false">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"));