How can I condense these jQ functions?

Question

//just working on some hw for a calculator

//I'm sure there is an easier way but I jsut don't remember how to do it.

//that's pretty much it but this website wants me to put more words in this post

//asdfasdfasdfsafs

$(document).ready(function(){
  console.log('jQ is working');


$(".operator1").click(function(){

  var a = document.getElementById('fieldA').value;
  var b = document.getElementById('fieldB').value;
  parseInt(a);
  parseInt(b);
  add = +a + +b;
  $('#answer').append(add);




});

$(".operator2").click(function(){

  var a = document.getElementById('fieldA').value;
  var b = document.getElementById('fieldB').value;
  sub = (a - b);
  $('#answer').append(sub);


});

$(".operator3").click(function(){

  var a = document.getElementById('fieldA').value;
  var b = document.getElementById('fieldB').value;
  mult = a * b;
  $('#answer').append(mult);

});

$("#operator4").click(function(){

  var a = document.getElementById('fieldA').value;
  var b = document.getElementById('fieldB').value;
  console.log(a / b);
  divi = a / b;
  $('divi').appened(divi);

});

function doMath(a, b){

}




});

did you really just type "asdfasdfasdfsafs"? oh no, you really did. -1 — tiwo, Jul 03 '17 at 06:11
yeah I dunno I have never used this site before and I had been turned away from posting like 4 times for not having enough non-code content — Dillon-Patterson, Jul 03 '17 at 06:29

prasanth · Answer 1 · 2017-07-03T06:18:34.157

Do with some data attribute

$(document).ready(function() {
  console.log('jQ is working');

  $('.operator').click(function() {
    var a = document.getElementById('fieldA').value;
    var b = document.getElementById('fieldB').value;
    a = parseFloat(a);
    b = parseFloat(b);
    var res = eval(a +$(this).attr('data-opr')+b);
  $('#answer').append(':'+res);
  });


  function doMath(a, b) {

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="operator" data-opr="+">+</button>
<button class="operator" data-opr="-">-</button>
<button class="operator" data-opr="*">*</button>
<button class="operator" data-opr="/">/</button>
<input type="number" value="2" id="fieldA">
<input type="number" value="9" id="fieldB">
<p id="answer"><p>

OP is novice, don't suggest `eval`, see https://stackoverflow.com/questions/86513/why-is-using-the-javascript-eval-function-a-bad-idea — Satpal, Jul 03 '17 at 06:18

How can I condense these jQ functions?

1 Answers1