Changing value of global variable in sub local function javascript

Question

There is no need the explain most of this code. As you can see the global variable cancel is set to true. Then a function is called in which the variable cancel is changed. It seems as though I can access the cancel variable on lines 15, 27, or 32. Can you explain why it doesn't work and how I can fix it? Thank you! Please ask any additional questions. I didn't explain the other code here because I don't think it pertains to the question directly and it would make this question too long to read if I were.

1. var cancel = 'true';
2. function setSliders()
3. {
4.  var sliders = document.getElementsByClassName('slider');
5.  var sliderButtons = document.getElementsByClassName('sliderButton');
6.  for(var i = 0; i != sliderButtons.length; i++)
7.  {
8.      var slider = document.getElementsByClassName('sliderButton')[i];
9.      slider.onmousedown = function()
10.     {
11.         cancel = 'false';
12.         this.onmouseup = function(cancel)
13.         {
14.             cancel = 'true';
15.             alert(cancel +' within semi function cancel does not seem to be accessible here');
16.             //alert('test');
17.         };
18.         
19.         alert(cancel+' within function');
20.         
21.         this.onmousemove = function(event, cancel)
22.         {
23.             if(cancel == 'false')
24.             {
25.                 console.log('cancel is false'); //cancel doesn't seem to be accessible here either.
26.                 this.style.left = event.clientX+'px';
27.                 cancel = 'true';
28.             }
29.             else
30.             {
31.                 console.log('cancel is true'); //cancel isn't accessible here either.
32.                 cancel = 'false';
33.             }
34.         };
35.     };

You made it a parameter of callback function and it shadows the global variable. — PM 77-1
– PM 77-1, Commented Mar 29, 2015 at 2:51

thebreiflabb · Accepted Answer · 2015-03-29 02:58:00Z

You have cancel as argument name to your functions, making cancel within those functions be local to that function.

If you remove cancel from the arguments, it will reference the global cancel variable and should work.

1. var cancel = 'true';
2. function setSliders()
3. {
4.  var sliders = document.getElementsByClassName('slider');
5.  var sliderButtons = document.getElementsByClassName('sliderButton');
6.  for(var i = 0; i != sliderButtons.length; i++)
7.  {
8.      var slider = document.getElementsByClassName('sliderButton')[i];
9.      slider.onmousedown = function()
10.     {
11.         cancel = 'false';
12.         this.onmouseup = function()
13.         {
14.             cancel = 'true';
15.             alert(cancel +' within semi function cancel does not seem to be accessible here');
16.             //alert('test');
17.         };
18.         
19.         alert(cancel+' within function');
20.         
21.         this.onmousemove = function(event)
22.         {
23.             if(cancel == 'false')
24.             {
25.                 console.log('cancel is false'); //cancel doesn't seem to be accessible here either.
26.                 this.style.left = event.clientX+'px';
27.                 cancel = 'true';
28.             }
29.             else
30.             {
31.                 console.log('cancel is true'); //cancel isn't accessible here either.
32.                 cancel = 'false';
33.             }
34.         };
35.     };

Collectives™ on Stack Overflow

Changing value of global variable in sub local function javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related