我知道这应该很简单，但是对于我的一生，我无法确定出来。我只需要一个mouseover事件即可在2之间切换图像，直到您第五次将鼠标悬停在它上面时，它才会变为第三张图像。这是我到目前为止所拥有的。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Tamra Schnyder Midterm Q2</title>
<script src="jquery-3.4.1.min.js"></script>
<script type="text/javascript">
function showHover(img) {
if (img) {
img.src="images/img1.jpg";
}
}
function showNormal(img) {
if (img) {
img.src="images/img2.jpg"
}
}
$(document).ready(function() {
$("#img1").mouseover(function(){
showHover(this);
}).mouseout(function(){
showNormal(this);
});
});
</script>
</head>
<br>
<h1>picture hover</h1><br/>
<img id="img1" src="images/img1.jpg" />
</body>每次鼠标移到图像上方时，您可以增加一个简单的counter，然后将其更改为第三张图像，而不是第二张图像count>=5：
function showHover(img) {
if (img) {
img.src="images/img1.jpg";
}
}
function showNormal(img, change) {
if (img) {
img.src=(change)?"images/img3.jpg":"images/img2.jpg";
}
}
$(document).ready(function() {
let count = 0;
$("#img1").mouseover(function(){
showHover(this);
count++;
}).mouseout(function(){
showNormal(this, count>=5);
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img id="img1" src="images/img1.jpg" />