How to calculate two numbers, but also get the result from a calculate button

Question

I want to do something similar that has been done a lot before, just with a little twist. I want to create 2 input fields where I find the result of a calculation by pressing a calculate button after I've written down what I need to write. I'm able to +,-,*, and /. The thing is, I'm able to make a code where when I push on these symbols, the answer will come. But what if I don't want the answer to come when I click on the symbols, but rather a calculate button? How do I do that? Please don't write your own code that is completely different than mine. And don't help if you don't know how to (although I appreciate you want to help). There is something here I don't understand. Please tell me what I'm doing wrong and why. Here is my code.

function kalkuler() {

  document.getElementById('pluss').onclick;
  document.getElementById('minus').onclick;
  document.getElementById('gange').onclick;
  document.getElementById('dele').onclick;
  document.getElementById('btnKnapp').onclick;

  var boks1 = parseInt(document.getElementById('txtBoks1').value);
  var boks2 = parseInt(document.getElementById('txtBoks1').value);

  document.getElementById('utskrift').innerHTML;


  function pluss() {
    document.getElementById('utskrift').value = boks1 + boks2;
  }

  function minus() {
    document.getElementById('utskrift').value = boks1 - boks2;
  }

  function gange() {
    document.getElementById('utskrift').value = boks1 * boks2;
  }

  function dele() {
    document.getElementById('utskrift').value = boks1 / boks2;
  }

}

Tall 1:<input id="txtBoks1" type="text" name="txtBoks1" />

<br><br>

<select name="regnetegn">
  <option id="pluss" value="pluss" name="+">+</option>
  <option id="minus" value="minus" name="-">-</option>
  <option id="gange" value="gange" name="*">*</option>
  <option id="dele" value="deling" name="/">/</option>
</select>

<br><br> 

Tall 2:<input id="txtBoks2" type="text" name="txtBoks2" />

<br><br>

<button onclick="kalkuler" id="btnKnapp" type="button">Kalkuler</button>

<p id="utskrift"></p>

Answer 1

please use following code

Tall 1:<input id="txtBoks1" type="text" name="txtBoks1" />

<br><br>

<select name="regnetegn" id="regnetegn">
  <option id="pluss" value="pluss" name="+">+</option>
  <option id="minus" value="minus" name="-">-</option>
  <option id="gange" value="gange" name="*">*</option>
  <option id="dele" value="deling" name="/">/</option>
</select>

<br><br> 

Tall 2:<input id="txtBoks2" type="text" name="txtBoks2" />

<br><br>

<button onclick="kalkuler();" id="btnKnapp" type="button">Kalkuler</button>

<p id="utskrift"></p>

<script>
function kalkuler() {

  var boks1 = parseInt(document.getElementById('txtBoks1').value);
  var boks2 = parseInt(document.getElementById('txtBoks2').value);
  var regnetegn = document.getElementById('regnetegn').value;
  document.getElementById('utskrift').innerHTML = '';

  if(regnetegn == "pluss")
    pluss(boks1,boks2);

  if(regnetegn == "minus")
     minus(boks1,boks2);

  if(regnetegn == "gange")
    gange(boks1,boks2);

  if(regnetegn == "deling")
    dele(boks1,boks2);

    return false;
}

function pluss(boks1,boks2) {
    document.getElementById('utskrift').innerHTML =  boks1 + boks2;
}

function minus(boks1,boks2) {
    document.getElementById('utskrift').innerHTML =    boks1 - boks2;
}

function gange(boks1,boks2) {
    document.getElementById('utskrift').innerHTML =    boks1 * boks2;
}

function dele(boks1,boks2) {
    document.getElementById('utskrift').innerHTML =    boks1 / boks2;
}
</script>

Answer 2

Try this.You can take the value from the select.Then change

var boks2 = parseInt(document.getElementById('txtBoks1').value);   

to

var boks2 = parseInt(document.getElementById('txtBoks2').value); 

Also change document.getElementById('utskrift').value to document.getElementById('utskrift').innerHTML

function kalkuler() {
  var calcOperation = document.getElementById('calcOption').value;
  /*Remove this 
  document.getElementById('pluss').onclick;
  document.getElementById('minus').onclick;
  document.getElementById('gange').onclick;
  document.getElementById('dele').onclick;
  document.getElementById('btnKnapp').onclick;*/

  var boks1 = parseInt(document.getElementById('txtBoks1').value);
  var boks2 = parseInt(document.getElementById('txtBoks2').value);

  document.getElementById('utskrift').innerHTML;


  if (calcOperation == 'pluss') {
    document.getElementById('utskrift').innerHTML = boks1 + boks2;
  }

  if (calcOperation == 'minus') {
    document.getElementById('utskrift').innerHTML = boks1 - boks2;
  }

  if (calcOperation == 'gange') {
    document.getElementById('utskrift').innerHTML = boks1 * boks2;
  }

  if (calcOperation == 'deling') {
    document.getElementById('utskrift').innerHTML = boks1 / boks2;
  }

}

<label>
    Tall 1:
    <input id="txtBoks1" type="number" name="txtBoks1" />
</label>

</br>
</br>

<select name="regnetegn" id="calcOption">
   <option  value="pluss" name="+">+</option>
   <option   value="minus" name="-">-</option>
   <option  value="gange" name="*">*</option>
   <option   value="deling" name="/">/</option>
   </select>

</br>
</br>

<label>
    Tall 2:
    <input id="txtBoks2" type="number" name="txtBoks2" />
</label>

</br>
</br>

<button onclick="kalkuler()" id="btnKnapp" type="button">Kalkuler</button>

<p id="utskrift"></p>