javascript - 鼠标悬停在图像 jquery 上

Question

请原谅我正在使用翻译的糟糕的英语和 ty 的帮助:)

我有一个问题，脚本可以满足我想要的问题，即一旦鼠标离开 image2-3-4 仍然是左侧图像（2-3-4）而不是初始图像

    <script type="text/javascript">
    var changetimer;

    function change (id) {
        clearInterval (changetimer);
        function swap() {
            if ( id.src.match ( " images/img1.jpg ")) { = id.src id.src.replace ( " images/img1.jpg ", " images/img2.jpg ") return false; }
            if ( id.src.match ( " images/img2.jpg ")) { = id.src id.src.replace ( " images/img2.jpg ", " images/img3.jpg ") return false; }
            if ( id.src.match ( " images/img3.jpg ")) { = id.src id.src.replace ( " images/img3.jpg ", " images/img4.jpg ") return false; }
            if ( id.src.match ( " images/img4.jpg ")) { = id.src id.src.replace ( " images/img4.jpg ", " images/img1.jpg ") return false; }

        }
        changetimer = setInterval ( Swap , 1500 ) ;
    }

    window.onload = function () {
        var images = document.getElementsByTagName('img');
        for (var i = 0; i < images.length ; i + +) {
            images[i]. onmouseover = function (evt) { change (this) ;}
            images[i]. onmouseout = function (evt) { clearInterval (changetimer); }
        }
    }
    </script>

Answer 1

你需要做的是改变这一行：

images[i]. onmouseout = function (evt) { clearInterval (changetimer); }

这样它就撤消了change函数所做的任何事情。所以像这样。

图像[i]。onmouseout = function (evt) { clearInterval (changetimer); 变回（这个）；}

changeBack与该函数的作用相反的函数在哪里change。

Answer 2

不必使用这么多 if 语句，您可以编写如下内容：

var array = [];
var images = document.getElementsByTagName ( ' img ');

for (var i=0;i<images.length;i++) {
     array[i] = i;
     images[i].onmouseover = function () { 
        var timer = setInterval(function(){
           array[i]+= 1;
           this.src="images/img"+array[i]+".jpg";
        },1500);
        this.onmouseout = function () { clearInterval (timer); this.onmouseout=null;}
     }
}