Question

我遇到onClick和onMouseOver的问题，我正在尝试使用纯JavaScript进行解析。

我有2张图片，当光标位于显示image1的{{1}}时，此image2有一个使用image2调用的功能。

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

onClick()

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

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

图片更改正确，但 <img src="imagens/favNulo.png" onMouseOver="show()" onMouseOut="hide()" id="favorito1" title="Favorito n°1" style="cursor:pointer;"/>  <img src="imagens/ferramentaFavoritos.png" onClick="editarTelaFav()" onMouseOver="show()" id="ferramenta1" title="Editar favorito n°1" style="cursor:pointer"/>不起作用。

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

编辑： onclick代码

onClick

Answer 1

这个逻辑位永远不会返回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'); 
}

Answer 2

你可以使用从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>

让onMouseOver和onClick工作的问题

2 个答案: