JavaScript won't output value in function

Viewed 84

Hi I am very new to Javascript. In the code below, when I test I don't see any output. Can anybody tell me what is wrong?

    <script>
        function myFunction()
        {
            var x="";
            var score=document.myscore.score.value;

            if (score>30)
            {
                x="Expert";
            }
            else
            }
                x="Novice";
            }
            document.write(x);
        }
    </script>
</head>
<body>
    <form name="myscore">
        Score: <id="score"> <input type="number" name= "score">
        <input type="submit" onClick="myFunction()" value="submit">

    </form>


</body>

5 Answers
<script>
function myFunction()
{
var x="";
var        score=document.myscore.score.value;

if (score>30)
        {
            x="Expert";
        }
        else
        {
            x="Novice";
        }
        document.write(x);
    }
</script>
</head>
<body>
<form name="myscore">
Score: <id="score"> <input type="number" name= "score">
<input type="submit" onClick="myFunction()" value="submit">

</form>


</body>

This should work! The problem was the orientatiom of { after the else.

A few things:

  1. <id="score"> <input type="number" name= "score"> is probably not what you mean. Maybe you mean <input type="number" name="score" id="score">.
  2. document.write is a no-no, please don't ever use it. It allows you to modify the document "here and now", i.e. while it's loading. Use document.body.innerHTML += x, for example.
  3. var score = document.getElementByID('score').value
  4. The bracket after the else clause

Try this:

  <script>
    function myFunction()
    {
        var x;
        var score=document.getElementById("in_score").value;

        if(score>30)
          x="Expert";
        else
          x="Novice";
        document.getElementById("score").value = x;
    }
  </script>
  <body>
    <form name="myscore">
     Score: <input id="score" type="number" name= "score">
     <input type="submit" id="in_score" onClick="myFunction()" value="submit">

    </form>


   </body>
   </html>

So the main error in your code was the reverse bracket from the else statement. Also, to get/change values from an input, you need to use getElementById ( to select the element ), and .value statement, to change/get it.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>enter code here
 <script>
        function myFunction()
        {
            var x="";
            var score=document.myscore.score.value;

            if (score>30)
            {
                x="Expert";
            }
            else
             {
                x="Novice";
            }
            document.write(x);
        }
    </script>
</head>
<body>
    <form name="myscore">
        Score: <id="score"> <input type="number" name= "score">
        <input type="submit" onClick="myFunction()" value="submit">

    </form>


</body>
</html>
  • Change input type from submit to button else you wont be able to see the output, because the form will submit and reload the page.
  • Fix the syntax errors <id="score"> Change } to { under else condition
  • Change document.write to alert or console.log
Related