Setting a Variable in Jquery or Javascript

Question

$('#firstname').bind('focusout focusin', function() {
    var get_firstname = $("#firstname").val().replace(/ /g, "+");
    var n_firstname = get_firstname.length;
    if (n_firstname > 2) {
        $(".firstname_good").fadeIn("fast");
        var firstname_v = 1;
    }
    else {
        $(".firstname_good").fadeOut("fast");
        var firstname_v = '';
    }
});

I'm have trouble understanding how to use the VAR firstname_v below. What do I need to do in the above to be able to use it below

$('#lastname').bind('focusout focusin', function() {
    if (firstname_v == 1) {
        alert(firstname_v);
    }
});

Research variable scope. Not understanding variable scope can lead to serious code problems later. — user400654
– user400654, Commented Jul 13, 2012 at 18:53
I don't have a strong understanding of variable scope or Jquery for that matter. That's why I came here with my question. I wanted to hear what the pro's had to say :) — MHowey
– MHowey, Commented Jul 13, 2012 at 19:00
I would post a link to a tutorial, but there are way too many to choose from. — user400654
– user400654, Commented Jul 13, 2012 at 19:02
Thanks anyway Kevin. I read through several already today. I've been writing php for years but I'm still a newbie when it comes to javascript and jquery — MHowey
– MHowey, Commented Jul 13, 2012 at 19:04

jbabey · Accepted Answer · 2012-07-13 18:53:02Z

2

You need to declare the variable in a higher scope that both inner scopes have access to:

var firstname_v; // declare it

$('#firstname').bind('focusout focusin', function() {
    var get_firstname = $("#firstname").val().replace(/ /g, "+");
    var n_firstname = get_firstname.length;
    if (n_firstname > 2) {
        $(".firstname_good").fadeIn("fast");
        firstname_v = 1; // no var here, you're just setting it
    }
    else {
        $(".firstname_good").fadeOut("fast");
        firstname_v = ''; // no var here, you're just setting it
    }
});

$('#lastname').bind('focusout focusin', function() {
    if (firstname_v == 1) { // no var here, you're just getting it
        alert(firstname_v);
    }
});

answered Jul 13, 2012 at 18:53

jbabey

46.7k12 gold badges73 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Blacksad · Accepted Answer · 2012-07-13 18:50:34Z

1

The problem is your variable is local to the callback function.

Declare it outside like this:

   var firstname_v = '';

   $('#firstname').bind('focusout focusin', function() {
    var get_firstname = $("#firstname").val().replace(/ /g, "+");
    var n_firstname = get_firstname.length;
    if (n_firstname > 2) {
        $(".firstname_good").fadeIn("fast");
        firstname_v = 1;
    }
    else {
        $(".firstname_good").fadeOut("fast");
    }
});

answered Jul 13, 2012 at 18:50

Blacksad

15.6k16 gold badges75 silver badges81 bronze badges

Comments

j08691 · Accepted Answer · 2012-07-13 18:51:57Z

1

Change the top block to:

var firstname_v;
$('#firstname').bind('focusout focusin', function() {
    var get_firstname = $("#firstname").val().replace(/ /g, "+");
    var n_firstname = get_firstname.length;
    if (n_firstname > 2) {
        $(".firstname_good").fadeIn("fast");
        firstname_v = 1;
    }
    else {
        $(".firstname_good").fadeOut("fast");
        firstname_v = '';
    }
});

Note that the only real change is that the declaration of firstname_v is now done outside the function rather than inside. This was it will be available throughout your code.

answered Jul 13, 2012 at 18:51

j08691

208k33 gold badges269 silver badges281 bronze badges

2 Comments

Gabriel Santos Over a year ago

varfirstname_v; should be var firstname_v;

j08691 Over a year ago

@GabrielSantos - Yup, typo fixed.

Gabriel Santos · Accepted Answer · 2012-07-13 18:57:22Z

0

Do this:

var firstname_v = 0;

$('#firstname').bind('focusout focusin', function() {
    var get_firstname = $("#firstname").val().replace(/ /g,"+");
    var n_firstname = get_firstname.length;

    if (n_firstname > 2) {  
        $(".firstname_good").fadeIn("fast"); 
        firstname_v = 1; 
    } else { 
        $(".firstname_good").fadeOut("fast"); 
    }
});

$('#lastname').bind('focusout focusin', function() {
    if (firstname_v == 1) {
        alert(firstname_v);
    }
});

edited Jul 13, 2012 at 18:57

answered Jul 13, 2012 at 18:51

Gabriel Santos

4,9742 gold badges45 silver badges74 bronze badges

3 Comments

jbabey Over a year ago

i don't think this addresses the issue.

jbabey Over a year ago

you dont need to try to see that firstname_v would be undefined in the other event handler you didn't post.

Gabriel Santos Over a year ago

You are right. I have copied only the top of code. Forgot the second bind

Collectives™ on Stack Overflow

Setting a Variable in Jquery or Javascript

4 Answers 4

Comments

Comments

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related