0
<p id="demo"></p>
<p id="demo2"></p>
<script>
function myFunction(x, y) {
    var mess2;
    var x = document.getElementById("id1").value;
    var y = document.getElementById("id2").value;
    var z = Math.abs(+ x) + Math.abs(+ y);
        if (var z <= 2.50) {
            mess2 = "message 1";
        } else if (2.50 < var z <= 4.00) {
            mess2 = "message 2";
        } else if (4.00 < var z <= 5.00) {
            mess2 = "message 3";
        } else {
            mess2 = "message 4";
        }
    document.getElementById("demo").innerHTML = + mess2;
    }
</script>

so this is my little function that I need to use to show some message depending on the inputed value that the user will write in an input window. the code worked fine when I outputed only the variable z as number, but when I added this if function it outputs nothing

Any advice? thank you :)

1
  • 1
    var z inside an expression is a syntax error. And there's no chained comparison in JavaScript.
    – Bergi
    Aug 30, 2016 at 7:17

5 Answers 5

4
function myFunction() { // no arguments here, x and y are calculated inside function
    var mess2;
    var x = document.getElementById("id1").value;
    var y = document.getElementById("id2").value;
    var z = Math.abs(x) + Math.abs(y); // Calculate z based on x and y
    if (z <= 2.50) {          // is z <= 2.50 ?
        mess2 = "message 1";
    } else if (z <= 4.00) {   // is z <= 4.00 ? (we know it's z > 2.50)
        mess2 = "message 2";
    } else if (z <= 5.00) {   // is z <= 5.00 ? (we know it's z > 4.00)
        mess2 = "message 3";
    } else {
        mess2 = "message 4";  // is z > 5.00?
    }
    document.getElementById("demo").innerHTML = mess2; // Change html of "demo" to the message
}

See this JSFiddle

3
  • An explanation of the changes would be nice.
    – Bergi
    Aug 30, 2016 at 7:36
  • I added some comments in my answer. Variable z must be declared only once, you can't redeclare it inside "if". Let me know if you need anything else :-)
    – Wizard
    Aug 30, 2016 at 7:42
  • @Matej Marić: if you like my solution, please kindly accept it as answer by clicking the checkmark :-)
    – Wizard
    Aug 30, 2016 at 7:46
1

Change:

document.getElementById("demo").innerHTML = + mess2;

to:

document.getElementById("demo").innerHTML += mess2;

and also you do not need to use 'var' keyword all the time, it is for declaration only.

Check this fiddle: https://jsfiddle.net/8cLegxbj/

1

This is because you declare variable z in if statement. Declare it once after if statements and all will ok

1

Check this:

  1. You are accessing value of x and y through some input IDs(as per my understanding on your code) so no need to pass as function arguments.

  2. no need to declare var in if condition as you have already declared it above.

  3. if(4 < z <=5) will always return true irrespective of z value, so you should use logical operators instead.

  4. Added a button to call you myFunction().

CODEPEN

function myFunction() {
  var mess2;
  var x = document.getElementById("id1").value;
  var y = document.getElementById("id2").value;

  var z = Math.abs(+x) + Math.abs(+y);
  if (z <= 2.50) {
    mess2 = "message 1";
  } else if (2.50 < z && z <= 4.00) {
    mess2 = "message 2";
  } else if (4.00 < z && z <= 5.00) {
    mess2 = "message 3";
  } else {
    mess2 = "message 4";
  }

  document.getElementById("demo").innerHTML = mess2;
}
-1

I have made some changes,, check sample here - https://jsfiddle.net/ugoxr5m8/2/

<p id="demo">

</p>

function myFunction(x, y) {
  var mess2;
  //var x = document.getElementById("id1").value;
  //var y = document.getElementById("id2").value;
  var z = Math.abs(+x) + Math.abs(+y);

  if (z <= 2.50) {
    mess2 = "message 1";
  } else if (2.50 < z <= 4.00) {
    mess2 = "message 2";
  } else if (4.00 < z <= 5.00) {
    mess2 = "message 3";
  } else {
    mess2 = "message 4";
  }

  document.getElementById("demo").innerHTML = mess2;
}

myFunction(1, 2);
2
  • Which changes? Why are they important?
    – Bergi
    Aug 30, 2016 at 7:35
  • This code does not work as expected for any values larger than 4.
    – Bergi
    Aug 30, 2016 at 7:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.