0

我有一个通过 jquery 更改图像来源的按钮。一切都很顺利,直到我尝试更改图像的悬停状态。这是一张图片的代码:

<td colspan="2" rowspan="3" align="left" valign="top">
    <a href="url">
        <img src="images/cplus.gif" width="89" height="29" id="cplusa" alt="C++" onmouseover="mouseOverImage()" onmouseout="mouseOutImage()" />
    </a>
</td>

这是按钮的代码:

<td colspan="3" align="left" valign="top">
    <img id="softbutton" src="images/softbuttonpng" width="132" height="33" alt="">

这是单击更改图像 src 的按钮时的 jquery 代码:

$('#softbutton').click(function() {
    $(this).attr("src","images/softbuttona.png");
    $("#cplusa").fadeTo(1000,0.30, function() {
        $("#cplusa").attr("src","images/cplusb.png");
    }).fadeTo(500,1);
)};

这就是问题所在 - 悬停运算符:

function mouseOverImage() { 
    document.getElementById("cplusa").src = "images/cplushover.png";
}
function mouseOutImage() { 
    if (document.getElementById("softbutton").src == "images/softbuttona.png")
        document.getElementById("cplusa").src = "cplusb.png";
    else {
        document.getElemebtById("cplusa").src="cplus";
    }
}

我在这里要做的是将图像恢复到其默认状态(这取决于按钮,因为它会在单击时更改图像的 src)。我所做的最远的是将按钮恢复到它的第一个状态(好像按钮没有被点击),但我永远无法将它恢复到它的第二个状态(当按钮被点击时)。使用我在此处发布的 javascript 代码,图像在鼠标悬停后会卡在悬停状态。

4

1 回答 1

0

您是否为函数中的按钮提供了正确的src属性mouseOutImage()?此外,考虑使用 jQuery 函数来获取您的元素,为了简单和稳健......也许是这样的:

function mouseOutImage() {
    if ($("#softbutton").attr('src') == "images/softbuttona.png")
        $("#cplusa").attr('src', 'images/cplusb.png'); // fixed source...
    else
        $("#cplusa").attr('src', 'images/cplus.gif'); // fixed source...
}

我试图根据您之前提供的代码来解释您的图像源,但我希望这有助于您找到正确的答案!

于 2013-09-23T23:07:14.717 回答