if statement - Calculating Circumference and Area of Circle With Javascript - Function Not Working

I'm trying to create a simple javascript application that will ask the user to enter the radius of a circle, and in return will display the circumference and area in sentence form after the user hits "Calculate". Right now, when the user enters a number and hits "calculate", nothing happens.

The JavaScript is included in the HTML document like this:

<!DOCTYPE html>
<html>
<head>
  <meta charset = "utf-8">
  <title>Create a Circle</title>
  <h1 style="text-align:center">Create a Circle!</h1>
  <br>
  <div style="text-align:center">
  Enter the radius for your circle:
  <input type="text" id="txtRadius" size="10" />
  <br>
  <input type="button" value="Calculate" onclick="CalculateArea()"/>

  <script>

  function print() {
    var p = 
    document.createElement("p"),
    text = Array.prototype.join.call(arguments,",");
    p.textContent = text;
    document.getElementById("console").appendChild(p);
    return text;    
  }

  function CalculateCircumference() {
    var radius =
    parseInt(document.getElementById('txtRadius').value);//String to Integer

    if (0 < radius)
        print("The circumference of the circle is " + (radius * 2 * Math.PI);
    else
        print("Error - radius must be a whole number greater than 0.");
    return false;
  }

  function CalculateArea() {
    var radius = 
    parseInt(document.getElementById('txtRadius').value); //String to Integer

    if (0 < radius)
        print("The area of the circle is " + (radius * radius * Math.PI);
    else
        print("Error - radius must be a whole number greater than 0.");
    return false;
  }
</script>
</head>
<body>
</body>   
</html>

I'm new to the print method so I tried changing all prints to "alert", but this didn't do anything. Thank you for your help. Link to JSFiddle: /

The JavaScript is included in the HTML document like this:

<!DOCTYPE html>
<html>
<head>
  <meta charset = "utf-8">
  <title>Create a Circle</title>
  <h1 style="text-align:center">Create a Circle!</h1>
  <br>
  <div style="text-align:center">
  Enter the radius for your circle:
  <input type="text" id="txtRadius" size="10" />
  <br>
  <input type="button" value="Calculate" onclick="CalculateArea()"/>

  <script>

  function print() {
    var p = 
    document.createElement("p"),
    text = Array.prototype.join.call(arguments,",");
    p.textContent = text;
    document.getElementById("console").appendChild(p);
    return text;    
  }

  function CalculateCircumference() {
    var radius =
    parseInt(document.getElementById('txtRadius').value);//String to Integer

    if (0 < radius)
        print("The circumference of the circle is " + (radius * 2 * Math.PI);
    else
        print("Error - radius must be a whole number greater than 0.");
    return false;
  }

  function CalculateArea() {
    var radius = 
    parseInt(document.getElementById('txtRadius').value); //String to Integer

    if (0 < radius)
        print("The area of the circle is " + (radius * radius * Math.PI);
    else
        print("Error - radius must be a whole number greater than 0.");
    return false;
  }
</script>
</head>
<body>
</body>   
</html>

I'm new to the print method so I tried changing all prints to "alert", but this didn't do anything. Thank you for your help. Link to JSFiddle: https://jsfiddle/HappyHands31/xzsf8ca4/2/

Share Improve this question edited Oct 11, 2017 at 20:52 payloc91 3,8092 gold badges20 silver badges47 bronze badges asked Dec 18, 2015 at 23:51 HappyHands31 4,10119 gold badges65 silver badges117 bronze badges

I don't know but maybe you will do radius > 0, otherwise zero is always less then radius – Franco Commented Dec 18, 2015 at 23:55
That didn't do anything unfortunately. – HappyHands31 Commented Dec 18, 2015 at 23:57
2 Yes, don't use 'print' - this prints the current page (litterally)! Try naming your function something else - like pPrint – Joseph Commented Dec 18, 2015 at 23:57
1 Your code is just buggy, and needs to be cleaned up before it can be diagnosed properly. Twice you call a method without closing the parenthesis (print("The circumference of the circle is " + (radius * 2 * Math.PI); and print("The area of the circle is " + (radius * radius * Math.PI);), and when you write document.getElementById("console").appendChild(p); where exactly is console defined? – TwoStraws Commented Dec 19, 2015 at 0:00
1 @user3546086 look at my answer, I have a working fiddle for you. – Adam Buchanan Smith Commented Dec 19, 2015 at 0:07

| Show 1 more ment

2 Answers 2

Sorted by: Reset to default 4

You have more issues with your code however this will answer your question

The reason nothing happens is because you are missing a ) and is makeing the function invalid.

change this: print("The area of the circle is " + (radius * radius * Math.PI);

to this: print("The area of the circle is " + (radius * radius * Math.PI));

See fiddle https://jsfiddle/xzsf8ca4/4/

function CalculateCircumference() {
    var radius =
    parseInt(document.getElementById('txtRadius').value);//String to Integer

    if (radius > 0)
        //calculate
    else
        //error
    return false;
  }

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

if statement - Calculating Circumference and Area of Circle With Javascript - Function Not Working - Stack Overflow

2 Answers 2

与本文相关的文章

评论列表(0)