Why will this switch statement only work with a single case?-CodePudding

Why will this switch statement not work? It will only work when I remove all but one (any) of the cases. It seems to get the values correctly and match them up to the correct case but when there is more than one case for it to select from it doesn't do anything.

function Calculate() {
     switch (document.getElementById("operator").value) {
            case " ":
                let result =  document.getElementById("v1").value  
                     document.getElementById("v2").value;
                document.getElementById("r").value = result;
                break;
            case "-":
                let result =  document.getElementById("v1").value  
                    -document.getElementById("v2").value;
                document.getElementById("r").value = result;
                break;
            case "*":
                let result =  document.getElementById("v1").value *
                     document.getElementById("v2").value;
                document.getElementById("r").value = result;
                break;
            case "/":
                let result =  document.getElementById("v1").value /
                     document.getElementById("v2").value;
                document.getElementById("r").value = result;
                break;
            case "^":
                let result = Math.pow( document.getElementById("v1").value,
                     document.getElementById("v2").value);
                document.getElementById("r").value = result;
                break;
        }
}

<form>
    <input type="number" id="v1" name="value1">
    <br>
    <input type="number" id="v2" name="value2">
    <br>
    <input type="button" onclick="Calculate()" value="Click to calculate">
    <br>
    <input type="number" id="r" name="result">
</form>

<select name="operators" id="operator">
    <option value=" "> </option>
    <option value="-">-</option>
    <option value="*">*</option>
    <option value="/">/</option>
    <option value="^">^</option>
</select>

CodePudding user response：

You are not allowed to declare a "let variable" multiple times inside of one function. I fixed that and shortened your code a little bit:

function Calculate() {
    let result = 0;

    switch (document.getElementById("operator").value) {
            case " ":
                result =  document.getElementById("v1").value  
                     document.getElementById("v2").value;
                break;
            case "-":
                result =  document.getElementById("v1").value  
                    -document.getElementById("v2").value;
                break;
            case "*":
                result =  document.getElementById("v1").value *
                     document.getElementById("v2").value;
                break;
            case "/":
                result =  document.getElementById("v1").value /
                     document.getElementById("v2").value;
                break;
            case "^":
                result = Math.pow( document.getElementById("v1").value,
                     document.getElementById("v2").value);
                break;
        }
        document.getElementById("r").value = result;
}