单击项目时更改鼠标悬停=“this.src='xxx'”

Change onmouseover="this.src='xxx'" when item is clicked

本文关键字：项目 xxx src this 鼠标 悬停 单击      更新时间：2023-09-26

我有这个图像，在悬停时会更改 src：

<img id="apripreventivo" src="img.svg" onmouseover="this.src='img_hover.svg'" onmouseout="this.src='img.svg'">

然后我有一个脚本，当单击该图像时切换一个div（#contact 形式）：

$(document).ready(function(){
        $("#contact-form").hide();
        $("#apripreventivo").show();
    $('#apripreventivo').click(function(){
    $("#contact-form").slideToggle();
    });
});

我如何重写上述函数，使其在单击图像 （#apripreventivo） 时，其onmouseover src 更改为例如 *img_hover2.svg*（"正常"src 和onmouseout相同。并且仍然 #contact 形式"div 在单击时切换）。然后，当再次单击时，onmouseover应返回到原始状态（*img_hover.svg*）。

我已经得到了

你大部分的方式：JSFiddle。

诀窍只是使用 jQuery 的 $.attr（） 方法更改 img 标签的属性。

$('img').click(function() {
    $(this).attr("onmouseover", "this.src='http://newevolutiondesigns.com/images/freebies/cat-wallpaper-7.jpg'");
})

您可以轻松编写一个函数来检查此属性的当前值，然后在单击时设置正确的值。希望这有帮助！

相关文章：