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

Popular posts from this blog

google chrome - Developer tools - How to inspect the elements which are added momentarily (by JQuery)? -

angularjs - Showing an empty as first option in select tag -

php - Cloud9 cloud IDE and CakePHP -