Trying to "save" a variable for a jQuery .load() callback

Question

Is there a way to "save" a variable in jQuery?

I have an .each() loop that changes the value of sz[1] and fires a .load() for each value. However, when I place sz[1] in the callback function, it only uses the last recorded value of sz[1], and not the value it had when I initially called .load().

$("#Big").find("a").each(function() {
  url = $(this).attr("href");
  pattern = new RegExp("sizes/([" + sizes + "])/$");
  otherPattern = new RegExp("sizes/([" + otherSizes + "])/$");
  sz = pattern.exec(url);
  if(sz) {
    normLink(sz[1], srcBase);
  } else {
    sz = otherPattern.exec(url);
    if(sz) {
      NotOkToDeLoad++;
      $("a#" + sz[1]).load(URL + sz[1] + " div#psp", function() { fixLink(sz[1]); });
    }
  }
});

sz[1] can be "k", "h" or "o". However, fixLink() is always called with that last possible value of "o" three times.

My current workaround is to write three separate .load()'s for each possible value of sz[1], but there ought to be an easier way. Am I overlooking something?

score 2 · Accepted Answer · edited May 23 '17 at 12:29

2

Get used to making your variables local, using var ^[MDN]:

var pattern = new RegExp("sizes/([" + sizes + "])/$");
var otherPattern = new RegExp("sizes/([" + otherSizes + "])/$");
var sz = pattern.exec(url);

Your problem is that sz is (implicitly) global and hence every iteration of the loop overwrites the previous value.

Avoid globals as much as possible. Tools like JSHint will warn you in case of implicit globals.

Also note that there is another problem when creating closures in a loop. It does not apply to your case, since you are using .each() and not a normal for loop, but better be aware of it.

edited May 23 '17 at 12:29

Community

1
1

answered Jun 17 '12 at 10:17

Felix Kling

795,719
175
1,089
1,143

P.S. I **had** declared the variables with a `var` statement, but they were declared globally. I like to reuse variable names when possible, but yeah, that wasn't very useful for this particular case. – druidic Jun 17 '12 at 10:33
@druidic: You're welcome :) If any answer helped you, please click the checkmark next to it, to accept it and to mark your question as solved. – Felix Kling Jun 17 '12 at 10:34

score 0 · Answer 2 · answered Jun 17 '12 at 10:18

0

Probably you are making global vairable sz try using var keyword.

answered Jun 17 '12 at 10:18

IProblemFactory

9,551
8
50
66

Alexander · Answer 3 · 2012-06-17T10:29:22.457

0

Use closure to save value (only if you can not make sz variable local!):

$("a#" + sz[1]).load(URL+ ...., (function(val) { return function(){ fixLink(val); } })(sz[1]));

edited Jun 17 '12 at 10:29

answered Jun 17 '12 at 10:23

Alexander

1,287
1
15
34

2

He already uses a closure, you are executing a function immediately to create a new scope. Of course said function is also a closure, but this is not relevant here. Anyways, better fix the actual problem: missing `var` statement. – Felix Kling Jun 17 '12 at 10:27

score -1 · Answer 4 · answered Jun 17 '12 at 09:56

-1

I don't know if it can help, but maybe you can store the variable that you need in a $.data() variable associated to the element... you can read something about this here

answered Jun 17 '12 at 09:56

MaJac89

151
4

It's more a comment than answer. – gdoron Jun 17 '12 at 09:57
Oh... I'm just starting to use stackoverflow... can I convert this "answer" into a comment?? – MaJac89 Jun 17 '12 at 10:15
For some very anonying reason, no, you can't, until you have 50 reputation points... Don't worry you will get there soon. – gdoron Jun 17 '12 at 10:45
A moderator can convert it (-> flagged). The reason for the reputation limit is probably to keep spammers and trolls away from comments. – ThiefMaster Jun 17 '12 at 21:46

Trying to "save" a variable for a jQuery .load() callback

4 Answers4