Question

目前我尝试检查图像上的鼠标悬停，如果鼠标指向图像，则会拍摄另一张图像来替换原始图像

这是我的代码：

ASPX代码：

    <img class="xyz" data-alt-src="<%=widget1%>" src="<%=widget1%>"/>

代码背后：

    protected string widget1
    {
        get
        {
            if (mousehover==true)
            {
                return "Pic/pic1.jpg";
            }
            else{
                return "Pic/pic2.jpg";
            }
        }
    }

Jquery的：

var sourceSwap = function () {
            var $this = $(this);
            var newSource = $this.data('alt-src');
            $this.data('alt-src', $this.attr('src'));
            $this.attr('src', newSource);
        }

    $('img[data-alt-src]').each(function () { 
    var $this = $(this); 
    new Image().src = $this.data('alt-src'); 
    $this.hover(sourceSwap, sourceSwap); });

Answer 1

你没有很好地处理悬停事件。这样做;

var sourceSwap = function () {
        var $this = $(this);
        var newSource = $this.data('alt-src');
        $this.data('alt-src', $this.attr('src'));
        $this.attr('src', newSource);
    }

$('img[data-alt-src]').hover(sourceSwap);

此外，将它放在文档就绪事件中以确保在附加此类事件之前所有dom都已完全加载;

$(document).ready(function(){
.....Your codes here


});

如何使用if- else检查鼠标悬停？

1 个答案: