javascript - HTML Button Won't Change JS Variable -
using js, on canvas, have ball moving across canvas. works fine.
i have created button element in html , want function, "changeballdirection()" called onclick.
changeballdirection() should change variable xballdirection, should change direction of ball.
the variable xballdirection doesn't change. printed xballdirection on canvas confirm wasn't changing. code below. first time posting, please let me know basic breaches in etiquette may have committed. thanks.
<script type="application/processing" data-processing-target="pjs"> void setup() { size(400, 400); }; framerate(20); var r=0; var xballdirection = 1; var changeballdirection = function (direction) { xballdirection = direction; }; //draw ball on canvas , move right void draw() { fill(45, 56, 99); ellipse(100+r, 34, 34, 34); r=r+xballdirection; //i printed xballdirection here see if changed when button pushed text(xballdirection,50,50); }; </script> <button style="width: 100px; height: 100px; background:blue" onclick="changeballdirection(-10)">ball left</button> <canvas id="pjs"> </canvas>
changeballdirection
not in global namespace , therefore cannot called within onclick event. should referenceerror: changeballdirection not defined
in console when click button.
move function outside of draw() portion of script , should work fine.
Comments
Post a Comment