I play around with js a little... I just don't get this.
The file below is just trying out some things... it does exactly what
I want (hides/displays some things, no big deal)
The problem is that in the swapcheck(x) function below, if I uncomment
the first line (commented with //) the whole thing brings and IE
errors the page with an object expected error on line (whichever input
control I clicked).
swapcheck isn't even getting called. I don't get why it is breaking
the page.
Any help greatly appreciated.
(note that if you try this file, you will need to create two css files
to link to)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Untitl ed Document</title>
<script language="javas cript">
<!--
function changeIt()
{
if (document.all.t heLine.style.di splay=='none') {
document.all.th eLine.style.dis play=''
}
else {
document.all.th eLine.style.dis play='none'
}
}
-->
</script>
<script language="javas cript">
<!--
function swapcheck(x) {
// if document.form1. calcat1.checked { } ' this line here!
}
function swapdisplay(x) {
x--
var theSheet=docume nt.styleSheets[1]
var theRule=theShee t.cssRules? theSheet.cssRul es[x]:
theSheet.rules[x]
if (theRule.style. display=="block ") {
theRule.style.d isplay="none" }
else {
theRule.style.d isplay="block" }
}
-->
</script>
<link href="newfbc.cs s" rel="stylesheet " type="text/css" />
<link href="calcats.c ss" rel="stylesheet " type="text/css" />
</head>
<body>
The next line should disappear and then reappear.
<div id="theLine" class="dynamic" >This is the one</div>
<div id="notTheLine " class="static"> This one should stay</div>
<p>
<form name="form1" method="post" action="">
<input type="button" onclick="change It()" value="Change!" />
<p>
<p class="calcat1" >Category 1 </p>
<p class="calcat2" >Category 2 </p>
<p class="calcat3" >Category 3 </p>
<p class="calcat4" >Category 4 </p>
<p class="calcat5" >Category 5 </p>
<p class="calcat6" >Category 6 </p>
<p class="calcat7" >Category 7 </p>
<p class="calcat8" >Category 8 </p>
<p class="calcat9" >Category 9 </p>
<p></p>
<p><br />
<input type="button" value="1" onclick="swapdi splay(1)" />
<input type="button" value="2" onclick="swapdi splay(2)" />
<input type="button" value="3" onclick="swapdi splay(3)" />
<input type="button" value="4" onclick="swapdi splay(4)" />
<input type="button" value="5" onclick="swapdi splay(5)" />
<input type="button" value="6" onclick="swapdi splay(6)" />
<input type="button" value="7" onclick="swapdi splay(7)" />
<input type="button" value="8" onclick="swapdi splay(8)" />
<input type="button" value="9" onclick="swapdi splay(9)" />
<table>
<tr>
<td>Category 1
<input type="checkbox" name="calcat"
onclick="swapdi splay(1)" />
</td>
<td>Category 2
<input type="checkbox" name="calcat"
onclick="swapdi splay(2)" />
</td>
<td>Category 3
<input type="checkbox" name="calcat"
onclick="swapdi splay(3)" />
</td>
<td>Category 4
<input type="checkbox" name="calcat"
onclick="swapdi splay(4)" />
</td>
<td>Category 5
<input type="checkbox" name="calcat"
onclick="swapdi splay(5)" />
</td>
<td>Category 6
<input type="checkbox" name="calcat"
onclick="swapdi splay(6)" />
</td>
<td>Category 7
<input type="checkbox" name="calcat"
onclick="swapdi splay(7)" />
</td>
<td>Category 8
<input type="checkbox" name="calcat"
onclick="swapdi splay(8)" />
</td>
<td>Category 9
<input type="checkbox" name="calcat"
onclick="swapdi splay(9)" />
</td>
</tr>
</table>
</form>
</body>
</html>
