How to pass a variable to another event handler in jQuery without delaying it Globally?

Question

I have these codes below

$('#first').click(function() {
    var TEST = 5;
    console.log(test)
})

$('#second').click(function() {
    console.log(test)
})

it looks like this is a weird question but is there any a way to pass a value of TEST from above to below then use it.

Note: I don't want to use a global variable in this case.

Thank in advance

Declare the variable globally... Means `var test` should be outside the handlers. -- And `test` is **not** the same variable as `TEST`. — Louys Patrice Bessette, Mar 21 '19 at 19:58
Possible duplicate of [Define global variable in a JavaScript function](https://stackoverflow.com/questions/5786851/define-global-variable-in-a-javascript-function) — Louys Patrice Bessette, Mar 21 '19 at 19:58
actually, i dont want to use global variable in this case so is there any another way ? — Nguyen Cao Cuong, Mar 21 '19 at 20:01
Your implementation (trying to change and re-use the same variable in multiple functions) is built in such a way that you rely on the use of a global, or at least broader-scoped, variable. If you don't want to use a global variable, then you'll need to take a different approach. You should really explain *what you're trying to do* instead of the issues you're having *with your attempted solution*. **See: [XY Problem](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem)** — Tyler Roper, Mar 21 '19 at 20:05
The easiest is to use a global variable. But you also could store the value in a DOM element instead... Or in local storage... You can have it as complicated as you want! — Louys Patrice Bessette, Mar 21 '19 at 20:06
You could always use a data attribute. `$(this).data('test', 5);` and then in the other method `$('#first').data('test')` for a getter — Taplar, Mar 21 '19 at 20:07
the value of variable 'TEST' is changed depending on columns which user click on. So set a constant value for TEST is not effective — Nguyen Cao Cuong, Mar 21 '19 at 20:16
it is a little bit inconvenience to post all my code here. My example is just a minified case and i thought it was the same. Thank for helping me and have a good nice day all of you — Nguyen Cao Cuong, Mar 21 '19 at 20:26

Ruan Mendes · Answer 1 · 2019-03-21T23:25:14.227

0

You can create an iife and share the variable in a closure. Just wrap your code with an iife and move that variable declaration outside both functions

(function(){
  var test;
  $('#first').click(function() {
      test = 5;
      console.log(test)
  })

  $('#second').click(function() {
    console.log(test)
  })
})();

edited Mar 21 '19 at 23:25

answered Mar 21 '19 at 20:39

Ruan Mendes

90,375
31
153
217

score 0 · Answer 2 · answered Mar 21 '19 at 20:54

0

You could use the browser's local storage as well.

$('#first').click(function() {    
    localStorage.setItem('TEST', 5);
    console.log(localStorage.getItem('TEST'));
})

$('#second').click(function() {
    console.log(localStorage.getItem('TEST'));
})

answered Mar 21 '19 at 20:54

AndyWarren

1,993
1
20
33

Thank for helping me sir. The value of variable 'TEST' is changed depending on columns which user click on. So in my opinion, set a constant value for TEST is not effective in this case. – Nguyen Cao Cuong Mar 21 '19 at 21:16
OP says not a global and you suggest saving it to disk? That's worse than a global variable – Ruan Mendes Mar 21 '19 at 23:23

How to pass a variable to another event handler in jQuery without delaying it Globally?

2 Answers2