Nel codice che riporto qui sotto, scrivendo i valori degli attributi delle proprietà del testo , si ha la scrittura richiesta. Cancellando questi valori, scrivendone di nuovi e cliccando il pulsante “scrivi” non viene eseguita la nuova scrittura: per ottenerla si deve rilanciare il codice.
Non riesco a capire il perché. Devo notare che in programmi analoghi, anche senza cancellare i valori con un pulsante apposito, ma soltanto cambiandoli dopo averli selezionati con il mouse, l’istruzione può essere eseguita più volte, senza rilanciare il codice.
Desidero sapere per quale motivo ciò avviene. Grazie

lanvoel

codice:
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid blue;">
</canvas>
<FIELDSET style=" width: 140px; height: 255px; position: absolute; left:550px; top:20px; background: aqua;"><LEGEND>scrittura testo</LEGEND>
<TABLE border=0>
<TR><TD>
testo:<input type="text" id="testo1" size=10><br>
xP=<input type="text" id="xP1" value="100" size=7><br>
yP=<input type="text" id="yP1" value="100" size=7><br>
colore=<input type="text" id="colore1" value="red" size=10><br>
col_bo=<input type="text" id="col_bo1" value="blue" size=10><br>
<input type="button" id="testo2" value="scrivi testo" onclick="testo()"><br>
<input type="button" id="cancella1" value="cancella dati" onclick="cancella()"><br>
</TABLE></FIELDSET>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
codice:
function testo()
{
testo=testo1.value;
colore=colore1.value;
col_bo=col_bo1.value
xP=xP1.value;
yP=yP1.value;
ctx.beginPath();
 ctx.font = "normal normal 80px Thaoma";       
 ctx.lineWidth=1;
 ctx.fillStyle=colore;                 //riempimento
 ctx.fillText(testo, xP, yP);          //riempimento
 ctx.strokeStyle=col_bo;                  //bordo
 ctx.strokeText(testo, xP, yP);           //bordo
ctx.closePath();
}
function cancella()
{
testo1.value="";
colore1.value="";
col_bo1.value="";
xP1.value="";
yP1.value="";
}
</script> 
</body>
</html>