Obter ID de controle .aspx no arquivo .js

Question

Aug 21, 2013, 11:19 AM

Obter ID de controle .aspx no arquivo .js

Olá a todos,

(Parte principal)

<script type="text/javascript">

function ChangeColor1(elementid)
{
document.getElementById(elementid).style.backgroundImage = "url('images/1.jpg')";
document.getElementById("<%= img2.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img3.ClientID%>").style.backgroundImage = "url'images/2.jpg')";
document.getElementById("<%= img4.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= imgchange.ClientID%>").style.backgroundImage = "url('images/img1.JPG')";
}

function ChangeColor2(elementid) 
{
document.getElementById(elementid).style.backgroundImage = "url('images/1.jpg')";
document.getElementById("<%= img1.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img3.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img4.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= imgchange.ClientID%>").style.backgroundImage = "url('images/img2.JPG')";
}

function ChangeColor3(elementid)
{
document.getElementById(elementid).style.backgroundImage = "url('images/1.jpg')";
document.getElementById("<%= img1.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img2.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img4.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= imgchange.ClientID%>").style.backgroundImage = "url('images/img3.JPG')";
}
function ChangeColor4(elementid)
{
document.getElementById(elementid).style.backgroundImage = "url('images/1.jpg')";
document.getElementById("<%= img2.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img3.ClientID%>").style.backgroundImage = "url('images/2.jpg')";
document.getElementById("<%= img1.ClientID%>").style.backgroundImage =  "url('images/2.jpg')";
document.getElementById("<%= imgchange.ClientID%>").style.backgroundImage = "url('images/img4.JPG')";
}
</script>

(PARTE DO CORPO)

<table>
<tr>
<td id="img1" runat="server" onmouseover="ChangeColor1(this.id)" 
    style="background-image: url('images/2.jpg')">
</td>
</tr>  
<tr>
<td id="img2" runat="server" onmouseover="ChangeColor2(this.id)" 
    style="background image: url('images/2.jpg')">
</td>
</tr>
<tr>
<td id="img3" runat="server" onmouseover="ChangeColor3(this.id)" 
    style="background-image: url('images/2.jpg')">
</td>
</tr>
<tr>
<td id="img4" runat="server" onmouseover="ChangeColor4(this.id)" 
    style="background-image: url('images/2.jpg')">
</td>
</tr>
</table>

Este código está funcionando bem na página .ASPX.

Mas quando eu coloco esse código de script no arquivo .js e o chamo na parte principal da página .ASPX, esse arquivo .js não está funcionando bem.

ID = img2, ID = img3, ID = img4 detd não está passando no arquivo .js.

Como posso passar todo esse ID no arquivo .js ???