title: HTML/Javascript Calculator
body: <p>I am taking a WebGIS lecture this semester and could use some assistance with debugging my code. It's a very simple HTML/js calculator, but it's giving me issues. None of the buttons are displaying any numbers or executing any functions in my js code. Could anyone give me a hand with figuring out what's wrong? I'm sure it's a simple fix, but the cones in my retinas are burning out trying to find it.</p>
  
  <p>Thank you!</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;Calculator!&lt;/head&gt;
  &lt;body&gt;
      &lt;script type="text/javascript" src="calculator.js"&gt;&lt;/script&gt;
      &lt;table&gt;
          &lt;tr&gt;
              &lt;td colspan="4"&gt;
                  &lt;input type="text" id="txtTotal" name="txtTotal" value="0"/&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td colspan="4"&gt;
                  &lt;input type="text" id="txtTrai" name="txtTrail" disabled='true' value="0"/&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td colspan="4"&gt;&amp;nbsp;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btnl" name="bnt1" value="1" onclick="nextVal(1);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn2" name="bnt2" value="2" onclick="nextVal(2);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn3" name="bnt3" value="3" onclick="nextVal(3);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &amp;nbsp;
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn4" name="bnt4" value="4" onclick="nextVal(4);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn5" name="bnt5" value="5" onclick="nextVal(5);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn6" name="bnt6" value="6" onclick="nextVal(6);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &amp;nbsp;
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn7" name="bnt7" value="7" onclick="nextVal(7);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn8" name="bnt8" value="8" onclick="nextVal(8);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn9" name="bnt9" value="9" onclick="nextVal(9);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="clear" name="clear" value="C" onclick="clearCalc()" /&gt;
              &lt;/td&gt;   
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;input type="button" id="plus" name="plus" value="+" onclick="setFunction('plus');" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="btn0" name="btn0" value="0" onclick="nextVal(0);" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="minus" name="minus" value="-" onclick="setFunction('minus');" /&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;input type="button" id="equal" name="equal" value="=" onclick="sum();" /&gt;
              &lt;/td&gt;   
          &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>var total = 0;
  var funct = '';
  
  function nextVal(1) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 1;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 1;
          txtTrail.value += ' ' + 1;
      }
      else if (funct == 'minus'); {
          total -= 1;
          txtTrail.value += ' ' + 1;
      }
      else {
          total = 1;
          txtTrail.value = 1;
      }
  }
  
  function nextVal(2) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 2;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 2;
          txtTrail.value += ' ' + 2;
      }
      else if (funct == 'minus'); {
          total -= 2;
          txtTrail.value += ' ' + 2;
      }
      else {
          total = 2;
          txtTrail.value = 2;
      }
  }
  
  function nextVal(3) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 3;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 3;
          txtTrail.value += ' ' + 3;
      }
      else if (funct == 'minus'); {
          total -= 3;
          txtTrail.value += ' ' + 3;
      }
      else {
          total = 3;
          txtTrail.value = 3;
      }
  }
  
  function nextVal(4) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 4;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 4;
          txtTrail.value += ' ' + 4;
      }
      else if (funct == 'minus'); {
          total -= 4;
          txtTrail.value += ' ' + 4;
      }
      else {
          total = 4;
          txtTrail.value = 4;
      }
  }
  
  function nextVal(5) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 5;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 5;
          txtTrail.value += ' ' + 5;
      }
      else if (funct == 'minus'); {
          total -= 5;
          txtTrail.value += ' ' + 5;
      }
      else {
          total = 5;
          txtTrail.value = 5;
      }
  }
  
  function nextVal(6) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 6;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 6;
          txtTrail.value += ' ' + 6;
      }
      else if (funct == 'minus'); {
          total -= 6;
          txtTrail.value += ' ' + 6;
      }
      else {
          total = 6;
          txtTrail.value = 6;
      }
  }
  
  function nextVal(7) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 7;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 7;
          txtTrail.value += ' ' + 7;
      }
      else if (funct == 'minus'); {
          total -= 7;
          txtTrail.value += ' ' + 7;
      }
      else {
          total = 7;
          txtTrail.value = 7;
      }
  }
  
  function nextVal(8) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 8;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 8;
          txtTrail.value += ' ' + 8;
      }
      else if (funct == 'minus'); {
          total -= 8;
          txtTrail.value += ' ' + 8;
      }
      else {
          total = 8;
          txtTrail.value = 8;
      }
  }
  
  function nextVal(9) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 9;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 9;
          txtTrail.value += ' ' + 9;
      }
      else if (funct == 'minus'); {
          total -= 9;
          txtTrail.value += ' ' + 9;
      }
      else {
          total = 9;
          txtTrail.value = 9;
      }
  }
  
  function nextVal(0) {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 0;
      var txtTrail = document.getElementById('txtTrail');
  
      if (funct == 'plus') {
          total += 0;
          txtTrail.value += ' ' + 0;
      }
      else if (funct == 'minus'); {
          total -= 0;
          txtTrail.value += ' ' + 0;
      }
      else {
          total = 0;
          txtTrail.value = 0;
      }
  }
  
  function setFunction(f) {
      var txtTrail = document.getElementById('txtTrail');
      funct = f;
  
      if (funct == 'true') {
          txt.Trail.value += ' +';
      }
      else if (funct == 'minus') {
          txt.Trail.value -= ' -';
      }
  }
  
  function sum() {
      var txtTotal = document.getElementById('txtTotal');
      if (txtTotal) {
          txtTotal.value = total;
      }
  
  function clearCalc() {
      var txtTotal = document.getElementById('txtTotal');
      txtTotal.value = 0;
  
      var txtTrail =document.getElementById('txtTrail');
      txtTotal.value = 0;
  
      total = 0;
      funct = '';
  }
  </code></pre>