javascriptの関数が何も返さない場合、なぜですか？

Question

<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> 

これは、ユーザーが入力ウィンドウに書き込む入力値に応じてメッセージを表示するために使用する必要がある小さな機能です。コードは数値として変数zのみを出力したときに正常に機能しましたが、関数を追加すると何も出力しません

アドバイスはありますか？

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

： は:)

Answer 1

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 
} 

は、if文では、あなたが変数zを宣言するためです。このJSFiddle

Answer 2

の変更をお願いします

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

ともあなたはすべての時間 'VAR' キーワードを使用する必要はありません、それが唯一の宣言です。

チェックこのフィドル： https://jsfiddle.net/8cLegxbj/

Answer 3

を参照してください。 ,,一度の後の文と、私はいくつかの変更を加えた

Answer 4

OKすべての意志であれば、それを宣言し、ここでサンプルをチェック - 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); 

Answer 5

チェックこの：

1. あなたはxの値にアクセスしていますいくつかの入力IDを介してy（あなたのコードを理解することによって）関数の引数として渡す必要はありません。

2. すでに宣言しているようにif条件でvarを宣言する必要はありません。

3. かわりに論理演算子を使用する必要がありますので、（4 < Z = 5 <）は常に関係なく、z値のtrueを返すかどう。

4. 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; 
}