Results 1 to 2 of 2

Thread: Javascript results in text boxes

  1. #1
    Join Date
    Aug 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Talking Javascript results in text boxes

    hello there,
    I have recently learned JS and i decided to start making a calculator for my webpage. the calculations went fine, but it's my first time trying to display the results in a text box in a form and i still haven't been able to figure it out. I get the number(s) and operator from a series of 3 prompts which activate when you click a button, and then i included a text box to display the results on mouse over (but i would be just as satisfied if i could just normally display it) , but nothing happens! Its probably from some error in the scripting, but i don't know what! Here is the script:

    <script type="text/javascript">
    function calculator(){
    var number = prompt("Enter the 1st number");
    var operator = prompt("Enter the operator (+,-,*,/,^2,^3,^,sqrt(),abs(),1/x,!,sin(),cos(),tan(),cot(),sec(),csc(),ln())");
    var number2 = prompt("Enter the 2nd number");

    function addition(number,number2) {
    return parseInt(number) + parseInt(number2);
    }

    function factorial(number) {
    if ((number == 0) || (number == 1))
    return 1
    else {
    answer = (number * factorial(number-1) )
    return answer;
    }
    }

    if (operator == "-"){
    var answer=number-number2;
    }else if (operator == "*"){
    var answer=number*number2;
    }else if (operator == "/"){
    var answer=number/number2;
    }else if (operator == "^2"){
    var answer=number*number;
    }else if (operator == "+"){
    var answer=addition(number,number2);
    }else if (operator == "^3"){
    var answer=number*number*number;
    }else if (operator == "^"){
    var answer=Math.pow(number,number2);
    }else if (operator == "sqrt()" && number >= 0){
    var answer=Math.sqrt(number);
    }else if (operator == "sqrt()" && number < 0){
    var answer=Math.sqrt(Math.abs(number))+"i";
    }else if (operator == "abs()"){
    var answer=Math.abs(number);
    }else if (operator == "1/x"){
    var answer=1/number;
    }else if (operator == "!"){
    var answer=factorial(number);
    }else if (operator == "sin()"){
    var answer=Math.sin(number);
    }else if (operator == "cos()"){
    var answer=Math.cos(number);
    }else if (operator == "tan()"){
    var answer=Math.tan(number);
    }else if (operator == "cot()"){
    var answer=Math.cos(number)/Math.sin(number);
    }else if (operator == "sec()"){
    var answer=1/Math.cos(number);
    }else if (operator == "csc()"){
    var answer=1/Math.sin(number);
    }else if (operator == "ln()"){
    var answer=Math.log(number);
    }else{
    alert("This calculator does not currently support operators other than addition, subtraction, multiplication, division, squaring, cubing, exponentation, square roots, absolute values, reciprocals, factorials, the 6 trig functions and natural logarithms.")
    }

    function output(answer) {
    document.getElementById('display').value = answer;
    }

    }
    </script>

    ...(I know its long) And here's the corresponding relevent HTML:

    <form id="form">
    <input type="button" onclick="calculator()" value="Click to Start!" />
    <input type="text" id="display" onmouseover="output(answer)" />
    </form>

    any help would be much appreciated and thanks for your time

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,800
    Thanks
    2
    Thanked 420 Times in 414 Posts

    Default

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script type="text/javascript">
    
    var answer='Please Click Start';
    
    function calculator(){
     document.getElementById('display').value = '';
     var number = prompt("Enter the 1st number");
     var operator = prompt("Enter the operator (+,-,*,/,^2,^3,^,sqrt(),abs(),1/x,!,sin(),cos(),tan(),cot(),sec(),csc(),ln())");
     var number2 = prompt("Enter the 2nd number");
    
     if (operator == "-"){
      answer=number-number2;
     }
     else if (operator == "*"){
      answer=number*number2;
     }
     else if (operator == "/"){
      answer=number/number2;
     }
     else if (operator == "^2"){
      answer=number*number;
     }
     else if (operator == "+"){
      answer=addition(number,number2);
     }
     else if (operator == "^3"){
      answer=number*number*number;
     }
     else if (operator == "^"){
      answer=Math.pow(number,number2);
     }
     else if (operator == "sqrt()" && number >= 0){
      answer=Math.sqrt(number);
     }
     else if (operator == "sqrt()" && number < 0){
      answer=Math.sqrt(Math.abs(number))+"i";
     }
     else if (operator == "abs()"){
      answer=Math.abs(number);
     }
     else if (operator == "1/x"){
      answer=1/number;
     }
     else if (operator == "!"){
      answer=factorial(number);
     }
     else if (operator == "sin()"){
      answer=Math.sin(number);
     }
     else if (operator == "cos()"){
      answer=Math.cos(number);
     }
     else if (operator == "tan()"){
      answer=Math.tan(number);
     }
     else if (operator == "cot()"){
      answer=Math.cos(number)/Math.sin(number);
     }
     else if (operator == "sec()"){
      answer=1/Math.cos(number);
     }
     else if (operator == "csc()"){
     answer=1/Math.sin(number);
     }
     else if (operator == "ln()"){
      answer=Math.log(number);
     }
     else{
     alert("This calculator does not currently support operators other than addition, subtraction, multiplication, division, squaring, cubing, exponentation, square roots, absolute values, reciprocals, factorials, the 6 trig functions and natural logarithms.")
     }
    }
    
    function addition(number,number2) {
     return parseInt(number) + parseInt(number2);
    }
    
    function factorial(number) {
     if ((number == 0) || (number == 1))
      return 1
     else {
      answer = (number * factorial(number-1) )
      return answer;
     }
    }
    
    function output() {
     document.getElementById('display').value = answer;
    }
    
    </script></head>
    
    <body>
    <form id="form">
    <input type="button" onclick="calculator()" value="Click to Start!" />
    <input type="text" id="display" onmouseover="output()" />
    </form>
    
    </body>
    
    </html>
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

Similar Threads

  1. How to get my javascript results to display
    By forum_amnesiac in forum HTML
    Replies: 0
    Last Post: 05-23-2009, 09:17 AM
  2. Save javascript results
    By ptera in forum Looking for such a script or service
    Replies: 0
    Last Post: 03-26-2009, 04:35 PM
  3. Narrow down your results boxes
    By frdxon23s in forum Looking for such a script or service
    Replies: 0
    Last Post: 02-01-2009, 05:35 PM
  4. Text Boxes
    By Freeman in forum CSS
    Replies: 2
    Last Post: 10-26-2005, 03:42 PM
  5. Text Boxes
    By Freeman in forum HTML
    Replies: 0
    Last Post: 10-25-2005, 03:47 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •