从函数外部访问值：js和php生成的值

Question

Hello fellow stackoverflow users, I'm trying again and again to access a variable from outside a function. So I know a variable can't normally be accessed from outside a function, but declaring it first outside the function or returning the variable should give me access, but I can't get it. Here's my code:

<select class='select-style' onchange="selectModel(this)">
  <option></option>
   <?php
    $select_cassetta_name = "select * from cassetta order by cassetta_name ASC";
    $run_cassetta = mysqli_query($con, $select_cassetta_name);
     while($row=mysqli_fetch_array($run_cassetta)){
      $cassetta_id = $row['cassetta_id'];
      $cassetta_name = $row['cassetta_name'];
      $cassetta_price = $row['cassetta_price'];
      echo "<option value='$cassetta_price'>$cassetta_name</option>";
     }
   ?> 
</select>


<div>
  <p id="box"></p>
</div>

<div>
  Sides SUM = <span id="sides_sum"></span> <br>
  Value x Sides = <span id="final_price"></span>
</div>



<script>

  var x;
  var y;
  var z;
  var sum;

  function getSides() {
    var x = parseFloat(document.getElementById("side1").value);
    var y = parseFloat(document.getElementById("side2").value);
    var sum = document.getElementById("sides_sum").innerHTML = x + y;
  }

  function selectModel(selectObject) {
    var z = parseFloat(selectObject.value);
    var cassetta = document.getElementById("box").innerHTML = "You selected value: " + z;
    document.getElementById("final_price").innerHTML = z * sum;
  }

</script>

Answer 1

Do not declare x, y and sum inside function using var. By declaring it using var you are overriding the global variable and creating a local variable. So you are not able to access its value in the other function

function getSides() {
    x = parseFloat(document.getElementById("side1").value);
    y = parseFloat(document.getElementById("side2").value);
    sum = document.getElementById("sides_sum").innerHTML = x + y;
  }