为什么我的图像会以这种方式滚动?

时间:2021-07-02 01:50:37

My image roll over works... But only one way.

我的图像翻转工作...但只有一种方式。

function heartOver(id)
{

    if(document.getElementById('heart' + id).src == 'images/heart.png');
    {
        parent.document.getElementById('heart' + id).src = 'images/unheart.png';
    }

    if(document.getElementById('heart' + id).src == 'images/unheart.png');
    {
        parent.document.getElementById('heart' + id).src = 'images/heart.png';
    }   

}


<img src="images/heart.png" id="heart'.$row['id'].'" alt="Love! width="16" height="16" border="0" onmouseover="heartOver'."('$row[id]')".'; return true;" onmouseout="heartOver'."('$row[id]')".'; return true;">

If i comment out either of the IF statements the other will work but they wont work together...

如果我注释掉任何一个IF语句,那么另一个会工作,但他们不会一起工作......

Note: Tried this with a else if no luck.

注意:如果没有运气,请用其他方法尝试。

Figured it out... Duh: i have if ( ) ; No ; after if...

想出来...... Duh:我有if();不如果......

2 个解决方案

#1


Put an else between them - otherwise when the first if evaluates as true, it will cause the second if to be evaluated as true also!

在它们之间添加一个else - 否则当第一个if计算为true时,它将导致第二个if被评估为true!

Here's a simplified example which also checks the assumption that the img element even exists:

这是一个简化的例子,它还检查了img元素甚至存在的假设:

var img=document.getElementById('heart' + id);
if (img)
{
    if(img.src == 'images/heart.png')
    {
        img.src = 'images/unheart.png';
    }
    else if(img.src == 'images/unheart.png')
    {
        img.src = 'images/heart.png';
    }
} 
else
{
     alert("Ooooh! No heart"+id+" element found!");
}    

#2


Is this correct?

它是否正确?

<img src="images/heart.png" id="heart'.$row['id'].'" alt="Love! width="16" height="16" border="0" onmouseover="heartOver'."('$row[id]')".'; return true;" onmouseout="heartOver'."('$row[id]')".'; return true;">

Try with this:

试试这个:

<img src="images/heart.png" id="heart<?php echo $row['id']; ?>" alt="Love!" width="16" height="16" border="0" onmouseover="heartOver(<?php echo $row['id']; ?>)" onmouseout="heartOver(<?php echo $row['id']; ?>)">

#1


Put an else between them - otherwise when the first if evaluates as true, it will cause the second if to be evaluated as true also!

在它们之间添加一个else - 否则当第一个if计算为true时,它将导致第二个if被评估为true!

Here's a simplified example which also checks the assumption that the img element even exists:

这是一个简化的例子,它还检查了img元素甚至存在的假设:

var img=document.getElementById('heart' + id);
if (img)
{
    if(img.src == 'images/heart.png')
    {
        img.src = 'images/unheart.png';
    }
    else if(img.src == 'images/unheart.png')
    {
        img.src = 'images/heart.png';
    }
} 
else
{
     alert("Ooooh! No heart"+id+" element found!");
}    

#2


Is this correct?

它是否正确?

<img src="images/heart.png" id="heart'.$row['id'].'" alt="Love! width="16" height="16" border="0" onmouseover="heartOver'."('$row[id]')".'; return true;" onmouseout="heartOver'."('$row[id]')".'; return true;">

Try with this:

试试这个:

<img src="images/heart.png" id="heart<?php echo $row['id']; ?>" alt="Love!" width="16" height="16" border="0" onmouseover="heartOver(<?php echo $row['id']; ?>)" onmouseout="heartOver(<?php echo $row['id']; ?>)">