0

我对onClickandonMouseOver有疑问，我正在尝试使用纯 JavaScript 来解决。

我有 2 张图像，当光标image1在image2出现时，它image2有一个用onClick().

我使用一个函数来更改 id 以显示/隐藏图像（使用 CSS）

function show()
{
    document.getElementById('ferramenta1').id='ferramenta100';
}

function hide()
{
    document.getElementById('ferramenta100').id='ferramenta1';  
}

<!-- image 1 -->

<img src="imagens/favNulo.png" onMouseOver="show()" onMouseOut="hide()" id="favorito1" title="Favorito n°1" style="cursor:pointer;"/>

<!-- image 2 -->
<img src="imagens/ferramentaFavoritos.png" onClick="editarTelaFav()"  onMouseOver="show()"  id="ferramenta1" title="Editar favorito n°1" style="cursor:pointer"/>

图像已正确更改，但onClick不起作用。

我在 StackOverflow 中发现了一些与此类似的帖子，但没有 jQuery 都无法解决。

编辑： onclick 代码

function editarTelaFav() {
   var fer1 = document.getElementById("ferramenta1").id;

   if (window.event.srcElement.id == fer1) {
     window.open('favoritoNumero1.jsp','','left=50%,top=50%,height=600,width=800');
   }
 }
4

2 回答 2

0

您可以使用 css 中的悬停来更改图像，这样您最终会得到一个 JavaScript 命令，这可能会有所帮助。在你的 CSS

#hoverchange  a {
width:64px;
height:64px;
background-image: url(imagens/favNulo.png);
display:block;
}

#hoverchange  a:hover {
background-image: url(imagens/ferramentaFavoritos.png);
}

宽度和高度应该是您的图像宽度和高度。

在你的 html 中

<div id="hoverchange">
<a href="#!" onClick="editarTelaFav()"></a>
</div>
于 2013-02-08T15:09:39.387 回答
0

这一点逻辑永远不会返回 1

if(window.event.srcElement.id == fer1){ code=1; }

因为每次你展示它时，你都会将 id 更改为 'ferramenta100'

document.getElementById('ferramenta1').id='ferramenta100';

tbh 我不明白该if语句的含义，删除它，它会正常工作，所以：

function editarTelaFav(){ 

window.open('favoritoNumero1.jsp','','left=50%,top=50%,height=600,width=800'); 
}
于 2013-02-08T15:02:53.197 回答