La duttilità e la relativa semplicità di personalizzazione, rendono Javascript un linguaggio volto a realizzare effetti dei più diversi ed eterogenei: dagli effetti grafici alle utility per pagine Web.
L'esempio di questa settimana puo' apparire ai più scarsamente pratico, ma a ben guardare un suo uso specifico, per taluni sviluppatori puo' risolvere problemi ai quali HTML non dà soluzioni. Si tratta di un Javascript che, attraverso un solo click del mouse, seleziona l'intero contenuto di un campo TEXTAREA di un form. Il campo TEXTAREA è quello solitamente deputato a raccogliere commenti in un modulo, e quindi non prevede campi predefiniti.
Spesso i campi TEXTAREA di un form sono usati per inserire codice HTML con relativi segni "<" e ">".
L'esempio si compone di 1 file:
esempio.htm
Per una più semplice comprensione del presente script fai continuamente riferimento ai file sopracitati, verificando le procedure e i dati espressi. Solo in questo modo, con un continuo confronto, comprenderai le peculiarità di questo Javascript.
Questo file è l'unico sul quale si deve agire inserendo il codice Javascript e il relativo campo TEXTAREA.
Questo il codice:
<form>
<script>
<!--
function highlight(x){
document.forms[x].elements[0].focus()
document.forms[x].elements[0].select()
}
//-->
</script>
<a href="javascript:highlight(0)" onMouseover="window.status='Seleziona
tutto';return true">Seleziona tutto</a>
<textarea rows="6" cols="40" WRAP=physical>
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.it
HTML.it - www.html.
</textarea>
</form>
Fondamentale, perchè lo script produca i suoi effetti, che la sintassi Javascript sia inserita all'interno dei tag <FORM>. In altre parole, prima bisogna aprire il form e successivamente inserire il campo <script>.
La riga di codice:
<a href="javascript:highlight(0)" onMouseover="window.status='Seleziona tutto';return true">Seleziona tutto</a>
Contiene in parte il richiamo alle funzioni impostate in precedenza, e il commento ("seleziona tutto") che appare nella status bar del browser quando il mouse passa sul link.
Nell'esempio il link è semplice testo, che ovviamente puo' sostituirsi con immagini GIF o JPG.
Il codice che segue e chiude l'esempio è un semplice campo TEXTAREA di un form HTML senza nessun particolare accorgimento da seguire.
