0

我对 JavaScript 还很陌生，我正在努力做到这一点，以便当您mouseover链接时，页面右侧的图像会发生变化，然后又会变回mouseout.

这是我的 JavaScript：

function SwapOut(titleid){
if (titleid == video)
    document.getElementById("titleimg").src="images/videotitle.png"
else if (titleid == gamedesign)
   document.getElementById("titleimg").src="images/gametitle.png"       
else if (titleid == webdesign)
   document.getElementById("titleimg").src="images/webtitle.png"    
return true;
}

function SwapBack('titleid'){
if (titleid == home)
    document.getElementById("titleimg").src="images/hometitle.png"
else if (titleid == gamedesign)
   document.getElementById("titleimg").src="images/gametitle.png"   
else if (titleid == video)
   document.getElementById("titleimg").src="images/videotitle.png"  
else if (titleid == webdesign)
   document.getElementById("titleimg").src="images/webtitle.png" 
return true;
}

还有我的 HTML：

<a id="eileenSmall1" href="video.html" onmouseover="SwapOut('video')" onmouseout="SwapBack('home')"></a>

<div id="title">
    <img src="images/hometitle.png" name="titleimg"/>
</div>

我通常会使用 CSS 来解决这个问题，但在更改不同元素的属性时遇到了问题。任何帮助，将不胜感激！

4

3 回答 3

0

您通过 id 引用 titleimg 但尚未为其分配 id，只是一个名称

 <img src="images/hometitle.png" name="titleimg" id="titleimg"/>

此外，您传递给函数的参数是一个字符串变量。你的函数应该看起来像

function SwapOut(titleid){
if (titleid == 'video')
    document.getElementById("titleimg").src="images/videotitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"       
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png"    
return true;
}

function SwapBack(titleid){
if (titleid == 'home')
    document.getElementById("titleimg").src="images/hometitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"   
else if (titleid == 'video')
   document.getElementById("titleimg").src="images/videotitle.png"  
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png" 
return true;
}

注意引号，您正在比较字符串，例如

titleid == 'home' vs titleid == home

也会丢失函数 SwapBack('titleid') 中的引号

于 2012-11-12T19:32:10.597 回答
0

1）你试图用id“titleimg”来引用一个元素，但你根本没有给这个元素一个id。

2）您的if条件不titleid与字符串进行比较，而是将其与它认为是变量的字符串进行比较。例如，它应该'video'不是video。

3）在你的第二个函数中，你的参数应该是一个变量而不是一个字符串。例如它应该SwapBack(titleid)不是SwapBack('titleid')。

你应该试试这个...

JAVASCRIPT：

function SwapOut(titleid){
if (titleid == 'video')
    document.getElementById("titleimg").src="images/videotitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"       
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png"    
return true;
}

function SwapBack(titleid){
if (titleid == 'home')
    document.getElementById("titleimg").src="images/hometitle.png"
else if (titleid == 'gamedesign')
   document.getElementById("titleimg").src="images/gametitle.png"   
else if (titleid == 'video')
   document.getElementById("titleimg").src="images/videotitle.png"  
else if (titleid == 'webdesign')
   document.getElementById("titleimg").src="images/webtitle.png" 
return true;
}

HTML：

<a id="eileenSmall1" href="video.html" onmouseover="SwapOut('video')" onmouseout="SwapBack('home')"></a>

<div id="title">
    <img src="images/hometitle.png" name="titleimg" id="titleimg" />
</div>
于 2012-11-12T19:40:04.990 回答
0

对于初学者，if (titleid == video)无效 - 您试图将视频引用为不存在的变量。应该是if (titleid == 'video')表示它是一串文本。

其次，如果逻辑在那里，你不需要那个。你在哪里你onmouseover="SwapOut('video')"可以把图像传递给它。

例如，

function swapOut(img)
{
    document.getElementById('titleimg').src = img;
}

HTML

<a id="eileenSmall1" href="video.html" onmouseover="SwapOut('images/videotitle.png')"></a>

Swapback 不需要任何条件逻辑（假设您总是想将图像切换回原处）。

于 2012-11-12T19:47:08.510 回答