Question

Its probably something really stupid that im doing but i searched a lot and for the life of me i dont get whats wrong(New in web design/programming).And i know it should fire when textbox loses focus but it doesnt.

<html>
<head>
<title>ask9</title>

<script>
function changeColor(){

var x=document.getElementById("box").value;
if(isNaN(x)==false)
{
    body.style.backgroundColor="yellow";
}
else if(isNaN(x)==true)
{
    body.style.backgroundColor="green";
}
else
{
    body.style.backgroundColor="red";
}
}
</script>
</head>
<body>


    <input type="text" id="box" onchange="changeColor()">

</body>
</html>
Was it helpful?

Solution

body isn't defined - you probably mean document.body or document.getElementsByTagName('body')[0] - see this jsFiddle: http://jsfiddle.net/LrrpM/

<html>
<head>
<title>ask9</title>
<script>
function changeColor() { 
    var x=document.getElementById("box").value;
    if(isNaN(x)==false)
    {
        document.body.style.backgroundColor="yellow";
    }
    else if(isNaN(x)==true)
    {
        document.body.style.backgroundColor="green";
    }
    /* // will never occur, isNaN() always returns a boolean
    else 
    {
        document.body.style.backgroundColor="red";
    }*/
}
</script>
</head>
<body>
    <input type="text" id="box" onchange="changeColor()"> 
</body>
</html>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top