Non so davvero se questo script possa risultare utile a qualcuno, ma non si sa mai... Cosa fa? Impedisce all'utente di selezionare il testo presente sulla pagina. Essendo basato sull'identificazione selettiva di specifici elementi con document.getElementById, è possibile applicare il comportamento a tutta la pagina o solo ad una parte.
Lo script è costituito da un file js esterno da collegare al documento HTML con la classica inclusione basata sul tag <script>.
- esempio.htm
## 1: LA SEZIONE JAVASCRIPT
Il cuore dello script è un piccolissimo file .js (disableSelect.js). Ecco il codice usato nell'esempio allegato:
window.onload = function() {
document.onselectstart = function() {return false;} // ie
document.onmousedown = function() {return false;} // mozilla
}
window.onload = function() {
var element = document.getElementById('content');
element.onselectstart = function () { return false; } // ie
element.onmousedown = function () { return false; } // mozilla
}
Si noti intanto l'accorto utilizzo dell'evento window.onload che ci consente di non dover richiamare la funzione principale dal documento HTML, essendo automaticamente eseguita al caricamento della pagina.
Abbiamo volutamente lasciato nel codice le funzioni nella forma che vedete. A ben vedere, infatti, risultano assolutamente identiche. Con una piccola cruciale differenza. Nella seconda si trova il riferimento all'elemento con id="content" presente nella pagina HTML. È il metodo da usare se si desidera restringere gli effetti della funzione ad una specifica sezione. In pratica: se si vuole impedire del tutto la salezione, basterà eliminare dal codice la seconda funzione. Altrimenti, sarà necessario specificare l'id dell'elemento.
## 1: SEZIONE HTML
Oltre all'inclusione dello script:
<script type="text/javascript" src="disableSelect.js"></script>
non ci sono osservazioni da fare, se non questa. La parte della pagina per cui si vuole impedire la selezione deve essere contrassegnata da un id corrispondente a quello indicato nel Javascript. Nel nostro caso:
<p id="content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.....</p>
