Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #31675

Why does savepng workl with eventlistener but not by call from form?

Show all headers | View raw

This does not work

<!DOCTYPE html>
<html>
<body onload="createCanvasContext()">
<form name=jj onSubmit="savepng(); return false;">
<input type=submit name="" value="SAVE">
</form>
<canvas id="myCanvas" width="400" height="400" color="yellow" style="border:1px solid #444444;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script>

function createCanvasContext()
{
canvas = document.getElementById("myCanvas");
ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(200,200,100,0,2*Math.PI);
ctx.fillStyle="#FF0000";
ctx.fill();
ctx.stroke();
}

function savepng() {
    var mypic = canvas.toDataURL('png');
    var anobject  = document.createElement('a');
    anobject.href = mypic;
    anobject.download = 'image.png';
}
</script>
</body>
</html>


But with eventlistener save work i do not understand why?

<!DOCTYPE html>
<html>
<body onload="createCanvasContext()">
<button id="pushit">Try it</button><br>
<canvas id="myCanvas" width="400" height="400" style="border:1px solid #000000;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>
document.getElementById("pushit").addEventListener("click", savepng);

function createCanvasContext()
{
canvas = document.getElementById("myCanvas");
ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(200,200,100,0,2*Math.PI);
ctx.fillStyle="#FF0000";
ctx.fill();
ctx.stroke();
}

function savepng() {
    var mypic = canvas.toDataURL('png');
    var anobject  = document.createElement('a');
    anobject.href = mypic;
    anobject.download = 'image.png';
    anobject.click()
}
</script>

Back to comp.lang.javascript | Previous | Next — Next in thread | Find similar | Unroll thread

Thread

Why does savepng workl with eventlistener but not by call from form? jonas.thornvall@gmail.com - 2016-11-10 14:35 -0800
  Re: Why does savepng workl with eventlistener but not by call from form? jonas.thornvall@gmail.com - 2016-11-10 15:47 -0800
    Re: Why does savepng workl with eventlistener but not by call from form? JJ <jj4public@vfemail.net> - 2016-11-11 21:05 +0700
      Re: Why does savepng workl with eventlistener but not by call from form? jonas.thornvall@gmail.com - 2016-11-11 06:35 -0800
        Re: Why does savepng workl with eventlistener but not by call from form? JJ <jj4public@vfemail.net> - 2016-11-11 22:01 +0700
          Re: Why does savepng workl with eventlistener but not by call from form? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-11-11 16:21 +0100
      Re: Why does savepng workl with eventlistener but not by call from form? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-11-11 16:08 +0100
        Re: Why does savepng workl with eventlistener but not by call from form? Scott Sauyet <scott@sauyet.com> - 2016-11-26 21:09 +0000
          Re: Why does savepng workl with eventlistener but not by call from form? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-11-26 22:47 +0100
            Re: Why does savepng workl with eventlistener but not by call from form? "Christoph M. Becker" <cmbecker69@arcor.de> - 2016-11-27 00:11 +0100
              Re: Why does savepng workl with eventlistener but not by call from form? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-11-27 00:57 +0100
                Re: Why does savepng workl with eventlistener but not by call from form? Scott Sauyet <scott@sauyet.com> - 2016-11-27 01:08 +0000
                Re: Limit number of function parameters (was:Why does savepng workl with eventlistener but not by call from form?) "Christoph M. Becker" <cmbecker69@arcor.de> - 2016-11-28 18:17 +0100
                Re: Limit number of function parameters (was:Why does savepng workl with eventlistener but not by call from form?) Scott Sauyet <scott@sauyet.com> - 2016-11-29 02:15 +0000
                Re: Limit number of function parameters "Christoph M. Becker" <cmbecker69@arcor.de> - 2016-12-02 20:24 +0100
                Re: Limit number of function parameters Scott Sauyet <scott@sauyet.com> - 2016-12-03 01:58 +0000

csiph-web