Home/ Questions/Q 8671905
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T19:04:03+00:00

I’m currently programming a calculator which is divided into two sections. The first section

  • 0

I’m currently programming a calculator which is divided into two sections. The first section is a textbox which takes a string (an activity the user has entered). The second section consists of 4 textboxes. Each textbox requires a number as input. In the second section of the calculator, the calculator textboxes are labeled days, hours, minutes, and seconds. The purpose of the calculator is to determine how much money after the activity is complete. The formula for the activity & code is shown below.

MoneyMadeDuringActivity = (NumOfDays * days) + (NumOfHours * hours) + (NumOfMinutes * minutes) + (NumOfSeconds * seconds)

    $(document).ready(function () {

  /**
   * VARIABLES
  ***/
  var activity = $('#txtActivity').text();
  var c = new Calculator();

  var days = $('#txtDays').text();
  var hours = $('#txtHours').text();
  var minutes = $('#txtMinutes').text();
  var seconds = $('#txtSeconds').text();

  var MoneyMadeDuringActivity = (days * c.per_day) + (hours + c.per_hour) + (minutes * c.per_minute) + (seconds * c.per_second);


  function listen(event, elem, func) {
    if (elem.addEventListener) {
      elem.addEventListener(event, func, false);
    } else if (elem.attachEvent) {
      var r = elem.attachEvent("on"+event, func);
      return r;
    }
  }

  listen("click", $("#btnCalculate"), (function() {
    $("#CalcOutput").text(
      "In the time it takes me to " + activity + ",<br />" + "Barack Obama makes " + "$" + MoneyMadeDuringActivity
    );
  });

});

My problem occurs with getting the output to work. I can’t get anything to be displayed. I have the div tag with an id=”CalcOutput”, so I don’t know why it won’t display correctly. Please help.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I saw you’re trying to insert html with the text method, this is wrong, you html method instead.

    $("#CalcOutput").html(
      "In the time it takes me to " + activity + ",<br />Barack Obama makes $" + MoneyMadeDuringActivity
    );

    EDIT

    This way worked for me. 

    <html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <script>
      //mocking up your Calculator class
      function Calculator(){
        this.per_day = 345665;
        this.per_hour = 67845;
        this.per_minute = 1234;
        this.per_second = 789;
      }

      $(document).ready(function () {

        function calculate(){
          var activity = $('#txtActivity').val();
          var c = new Calculator();

          var days = +$('#txtDays').val();
          var hours = +$('#txtHours').val();
          var minutes = +$('#txtMinutes').val();
          var seconds = +$('#txtSeconds').val();

          var MoneyMadeDuringActivity = (days * c.per_day) + (hours + c.per_hour) + (minutes * c.per_minute) + (seconds * c.per_second);

          $("#CalcOutput").html(
            "In the time it takes me to " + activity + ",<br />Barack Obama makes $" + MoneyMadeDuringActivity
          );
        }


        $("#btnCalculate").click(function() {
          calculate();
        });

      });

    </script>
  </head>
  <body>
    activity:
    <input type='text' id='txtActivity' value='foobar' /><br/>
    days:
    <input type='text' id='txtDays' value='3'/><br/>
    hours:
    <input type='text' id='txtHours' value='12'/><br/>
    minutes:
    <input type='text' id='txtMinutes' value='34'/><br/>
    seconds:
    <input type='text' id='txtSeconds' value='37' /><br/>
    <button id='btnCalculate'>Calculate</button><br>
    <div id="CalcOutput"></div>
  </body>
 </html>
    • 0