Accessing ID values
Im am trying to access the id element of an image. Here is my code in which only one if statement block should execute, but either all or none are executing. Any ideas?
<script language="JavaScript" type="text/JavaScript">
ButtonOn = new Image ();
ButtonOn.src = "http://131.91.82.164/images/ed2/lighton.gif";
ButtonOff = new Image ();
ButtonOff.src = "http://131.91.82.164/images/ed2/lightoff.gif";
function button_down()
{
if(document.form1.light1 == 'light1')
{
if (document.form1.light1.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "7900000021131212";
document.form1.submit() ;
}
if (document.form1.light1.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "7900000021131212";
document.form1.submit() ;
}
}
if(document.form1.id == 'light2')
{
if (document.form1.light2.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "4300000021243112";
document.form1.submit() ;
}
if (document.form1.light2.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "4300000021243112";
document.form1.submit() ;
}
}
if(document.form1.id == 'light3')
{
if (document.form1.light3.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "590000001187E412";
document.form1.submit() ;
}
if (document.form1.light3.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "590000001187E412";
document.form1.submit() ;
}
}
if(document.form1.id == 'light4')
{
if (document.form1.light4.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "BC0000001183FC12";
document.form1.submit() ;
}
if (document.form1.light4.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "BC0000001183FC12";
document.form1.submit() ;
}
}
if(document.form1.id == 'light5')
{
if (document.form1.light5.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "C200000011861B12";
document.form1.submit() ;
}
if (document.form1.light5.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "C200000011861B12";
document.form1.submit() ;
}
}
}
</SCRIPT>
.
.
.
.
.
.
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light1"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light2"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light3"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light4"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light5"></a></div></td>
.
.
.
.
.
.
Is this a typo?
if(document.form1.light1 == 'light1')
Hi. You know? I was just going to fix your code, and i saw you're making reference (a lot) to some form elements, but you're not including such a form.
In order to help you, please publish the complete code, including all elements, or it will be imposible to help you without deleting those references.
Also, please explain better what is exactly what you need the script to do, besides changing the image on mouse out and over.
Paco.
Here is the entire code. What I want to happen is when a user click on a certain image it sends the correct DEVICE= hidden form data. The JavaScript needs to know what button image the user clicked on, then set DEVICE= to the appropriate value.
Thanks.
<html>
<head>
<title>Engineering Design II - Light Module</title>
<link rel = "stylesheet" type = "text/css" href = "http://131.91.81.130/css/style.css" />
<script language="JavaScript" type="text/JavaScript">
ButtonOn = new Image ();
ButtonOn.src = "http://131.91.82.164/images/ed2/lighton.gif";
ButtonOff = new Image ();
ButtonOff.src = "http://131.91.82.164/images/ed2/lightoff.gif";
function button_down()
{
if(document.form1.name.href == 'light1')
{
if (document.form1.light1.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "7900000021131212";
document.form1.submit() ;
}
if (document.form1.light1.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "7900000021131212";
document.form1.submit() ;
}
}
if(document.form1.name == 'light2')
{
if (document.form1.light2.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "4300000021243112";
document.form1.submit() ;
}
if (document.form1.light2.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "4300000021243112";
document.form1.submit() ;
}
}
if(document.form1.id == 'light3')
{
if (document.form1.light3.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "590000001187E412";
document.form1.submit() ;
}
if (document.form1.light3.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "590000001187E412";
document.form1.submit() ;
}
}
if(document.form1.id == 'light4')
{
if (document.form1.light4.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "BC0000001183FC12";
document.form1.submit() ;
}
if (document.form1.light4.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "BC0000001183FC12";
document.form1.submit() ;
}
}
if(document.form1.id == 'light5')
{
if (document.form1.light5.src == ButtonOn.src)
{
document.form1.DESIREDSTATE.value = "off";
document.form1.DEVICE.value = "C200000011861B12";
document.form1.submit() ;
}
if (document.form1.light5.src == ButtonOff.src)
{
document.form1.DESIREDSTATE.value = "on";
document.form1.DEVICE.value = "C200000011861B12";
document.form1.submit() ;
}
}
}
</SCRIPT>
</head>
<body>
<table width="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" height="36" colspan="4" align="center"><strong>
</strong></td>
</tr>
<tr>
<td width="115" height="9"></td>
<td width="570" height="9"></td>
<td width="115" height="9"></td>
</tr>
<tr>
<td width = "115" height="500" valign="top"><p> </p>
<p> </p>
<p>
<br>
</p></td>
<td width="570" height="500" valign="top">
<div align="center">
<p> </p>
<p><strong>Light Module</strong></p>
<table border="0" cellpadding="0" cellspacing="0" width="360" height="0%" bordercolor="silver" bordercolorlight="black">
<tr>
<td width="359"><p align="left">
<center>
<p> <font size="2">Current Status</font></center></td>
</tr>
</table>
</div>
<form name="form1" method="get" action="/servlet/OneWireServlet12">
<p align="center">
<input type="hidden" name="DEVICE" value="">
<input type="hidden" name="FAN_OR_LIGHT_OR_MON" value="light">
<input type="hidden" name="DESIREDSTATE" value="">
</p>
<table width="75%" border="1" align="center">
<tr>
<td><div align="center">Light 1:</div></td>
<td><div align="center">Light 2:</div></td>
<td><div align="center">Light 3:</div></td>
<td><div align="center">Light 4:</div></td>
<td><div align="center">Light 5:</div></td>
</tr>
<tr>
<td><div align="center"><a href="javascript :button_down()" name="light1"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light1"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light2"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light3"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light4"></a></div></td>
<td><div align="center"><a href="javascript :button_down()"><img src="http://131.91.82.164/images/ed2/lightoff.gif" width="75" height="74" border="0" align="middle" id="light5"></a></div></td>
</tr>
</table>
<p align="center"> </p>
<p align="center"> </p>
</form>
<p> </p><td width="115" height="500"></td>
</tr>
<tr>
<td width="115" height="26"></td>
<td width="570" height="26" valign="top">
</td>
<td width="115" height="26"></td>
</tr>
</table>
</body>
</html>
</body></html>
Thread Information
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Posting Permissions
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
Forum Rules
Bookmarks