in javascript, image must change with var lvl, but it doesn't

Question

I'm new in javascript and in web programming on the whole. I'm trying to make script which will change image pic0.png depending on var lvl's value.

This is the script:

<!DOCTYPE html>
<html>
<body>

<script>
    var pic = "pic0.png";
</script>

<img id="myImg" src="pic0.png" width="107" height="98">
<p>Click the button to change the value of the src attribute of the image.</p>

<button onclick="myFunction()">Try it</button>

<script>

function myFunction() 
{
    var lvl = 2;
    if (lvl = 1)
    {
        pic = "pic1.png";
    }
    else if (lvl = 2)
    {
        pic = "pic2.jpg";
    }
    document.getElementById("myImg").src = pic;
}

</script>

</body>
</html>

When var lvl equals to 2, picture must change to pic2.jpg, but there is problem - after I click button 'try it!', the picture changes to pic1.png, no matter if var lvl equals 2 or 1.

Check your Comparison operators..Must be `==` – Rayon Dec 16 '15 at 09:55 — Rayon, Dec 16 '15 at 09:55

score 2 · Accepted Answer · edited Dec 16 '15 at 10:24

2

You're assigning the value instead of checking. You need to use the double equal operator:

function myFunction() 
{
  var lvl = 2;
  if (lvl == 1)
  {
    pic = "pic1.png";
  }
  else if (lvl == 2)
  {
    pic = "pic2.jpg";
  }
  document.getElementById("myImg").src = pic;
}

edited Dec 16 '15 at 10:24

Toothbrush

2,080
24
33

answered Dec 16 '15 at 09:54

jcubic

61,973
54
229
402

Thanks a lot, I have forgotten about comparison operator. – Hugo Greame Dec 16 '15 at 10:10
@Hugo Please mark this as the correct answer if it solves the issue. – Toothbrush Dec 19 '15 at 14:18

score 0 · Answer 2 · answered Dec 16 '15 at 09:55

0

== or === should be used when comparing. = is an assignment operator.

if (lvl == 1)
{
pic = "pic1.png";
}
else if (lvl == 2)
{
pic = "pic2.jpg";
}

answered Dec 16 '15 at 09:55

void

36,090
8
62
107

in javascript, image must change with var lvl, but it doesn't

2 Answers2