problem with radio button changing background color

**strikefist** · Apr 4, 2011 17:41

<HTML>
<Head>
<Script Language=JavaScript>

function change_it()
{
var a=document.forms["myForm"]["colorc"].getInputValue

if(a="blue")
{
document.body.style.background=a
return false;
}
else if(a="red")
{
document.body.style.background=a
return false;
}

else if(a="yellow")
{
document.body.style.background=a
return false;
}
}

</Script>
</Head>
<body>
<form name="myForm">
<input type="radio" name="colorc" value="blue">blue <br>
<input type="radio" name="colorc" value="red">red <br>
<input type="radio" name="colorc" value="yellow">yellow <br/> <br />

<input type="button" value="changecolor" name="ChangeColor" onClick="return change_it()"> <br /> <br />
</form>
</body>
</html>

problem:"it only change background color into blue"

**oblig** · Apr 5, 2011 08:54

You're using assignment (=) instead of comparison (==) in the if statements.

**lnhicks** · Apr 5, 2011 18:01

You'll need to correct those comparison operators as obliq says. Your getInputValue function was not included. However, the following works:

Code:

<!DOCTYPE HTML>
<head>
<title>Test</title>
<script type="text/javascript">
function getInputValue() {
  var radioObj = document.forms["myForm"]["colorc"];
  for (var i=0; i<radioObj.length; i++) {
    if (radioObj[i].checked)
      return radioObj[i].value;
  }
  alert("No radio button was selected.")
}

function change_it() {
  var a = getInputValue();
  if(a=="blue") {
    document.body.style.background=a
    return false;
  } else if(a=="red") {
    document.body.style.background=a
    return false;
  } else if(a=="yellow") {
    document.body.style.background=a
    return false;
  }
}
</script>
</head>
<body>
<form name="myForm">
  <input type="radio" name="colorc" value="blue">blue <br>
  <input type="radio" name="colorc" value="red">red <br>
  <input type="radio" name="colorc" value="yellow">yellow <br/> <br />
  <input type="button" value="changecolor" name="ChangeColor" onclick="return change_it()"> 
</form>
</body>
</html>

**lnhicks** · Apr 5, 2011 18:51

Whoops! Just noticed that change_it() function is way too long. Should be just this:

Code:

function change_it() {
  document.body.style.background = getInputValue();
}

User Tag List

Thread: problem with radio button changing background color

Thread Tools

Display

problem with radio button changing background color

Bookmarks

Bookmarks

Posting Permissions