JavaScript Calculator project + jQuery

JavaScript
1

Hello,
I’m starting this calling
here is my code
Codepen_JS_calculator
And I have get first question but not last.
Now I have made AC button which delete the all data
But how I can get access only for the last character of the line?

<p>/delet all data AC button 
    $("#btnAC").click(function(){
      $("#line").val('');
    });
  //delet last entered numbers CE button
    $("#btnCE").click(function(){
     //??? How to access the last number or operator from the line
    });</p>
2

Try targeting the element you display the numbers in
get the text
then you can do stuff to the string you get
then reapply the text back to the element

1 Like
3

Hello,
I continue my work on the calculator.
Codepen
Today I little improve my code but here is a lot jobs. Now I’m trying to set the AC button.
When enering first number and press AC button it works OK. but when I trying to reset sum I need press two time on it?
What is wrong with my code?
And here is more bugs I know it, but now I’m trying to solve AC button bug.

<p>
let num1 = '';
let num2 = '';
let operator = '';
let total = '';


//========================================
$(document).ready(function() {  
  $('button').on('click', function(e){
    let btn = e.target.innerHTML;
    if(btn >= '0' && btn <= '9'){
      handleNumber(btn);
    }else{
      handleOperator(btn);
    }
  });
  
});


//-------------------------------------
 
function handleNumber(num){
  if(num1 === ''){
    num1 = num;
  }else{
    num2 = num;
  }
  displayButton(num);
}
//====================================

function handleOperator(oper){
  if(operator === ''){
  operator = oper;
  }else{
    handleTotal();
    operator = oper;
  }
}
//=====================================

function handleTotal(){
  switch(operator){
    case '+':
      total = +num1 + +num2;
      displayButton(total);
      break;
    case '-':
      total = +num1 - +num2;
      displayButton(total);
      break;
    case '*': 
      total = +num1 * num2;
      displayButton(total);
      break;
    case '/': 
      total = +num1 / +num2;
      dispalyaButton(total);
      break;
    case 'AC':
      total = '0';
      displayButton(total);
      break;
  }
  updateVariables();
}

//======================================
function displayButton(btn){
  $('#line').text(btn);
}

function updateVariables(){
  num1 = total;
  num2 = '';
}

</p>
4

My suggestion is because of this part in the handleOperator() function:

handleTotal();
operator = oper;

First you invoke the function and just then assign to them AC, but displayButton() already is done by that time.
General advice - try to less use global variables, it’ll simplify you debugging, although here it’s not so simple.

1 Like
5

Hello,
I have deleted all my prevewsed code and trying to do all from scratch again.
codepen_calculator
question how to concatenate two single string numbers and display it.
Now when I press 8 then 9 display show only single character but I need 89

<p>
function handleNumber(number){
 //let currString = [];
 // HOW to concatenate number ?????
//  console.log(currString);
 handleLine(currValue);
 return number;
}

//======================================
function handleOperator(operator){
 handleLine(operator);
 return operator;
}

//=======================================
function handleLine(btn){  
 $("#line").text(btn);
}
//========================================
$(document).ready(function() {  
 $('button').on('click', function(e){
   let btn = this.innerHTML;
   if(btn >= 0 && btn <= 9){
     handleNumber(btn);
   }else{
     handleOperator(btn);
   }    
 });  
});
//----------------------------------------

</p>