简单的JavaScript帮助

喜即时通讯新的JavaScript基本上设法解决。当我点击链接在占位符中显示图像。如果PLACEHOLDER1使用由任一1.JPG，2.JPG，或3.JPG然后离开PLACEHOLDER1与该图像并使用PLACEHOLDER2。希望是有道理的感谢您的帮助简单的JavaScript帮助

<script type="text/javascript" language="javascript"> 
function showPic (whichpic) { 
    if (document.getElementById) { 
     document.getElementById('placeholder1').src = whichpic.href 
     if (whichpic.title) { 
      document.getElementById('desc').childNodes[0].nodeValue = whichpic.title; 
     } else { 
      document.getElementById('desc').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue; 
     } 
     return false; 
    } else { 
     return true; 
    } 
} 
</script> 

<div style="border: 1px solid #999; padding: 1em; margin: 0 0 15px 0;"> 
<ul> 
<li><a onclick="return showPic(this)" href="/images/1.jpg" title="A bunch of bananas on a table">some bananas</a></li> 
<li><a onclick="return showPic(this)" href="/images/2.jpg" title="Condiments in a Chinese restaurant">two bottles</a></li> 
<li><a onclick="return showPic(this)" href="/images/3.jpg" title="Seashells on a table">some shells</a></li> 
</ul> 

<p id="desc">Choose an image to begin</p> 
<img id="placeholder1" src="/images/blank.gif" alt="" /> 
<img id="placeholder2" src="/images/blank.gif" alt="" /> 
</div>

来源

2011-08-04 Lee

请澄清你的问题。 –

修订我的问题 – Lee

如果你问如何找出一个属性的元素中的值，你可以使用jQuery像这样....

var src = $('#placeholder1').attr('src');

那么你可以使用的指数，或其他一些字符串函数来确定src属性contrains你感兴趣的文件名。

来源

2011-08-04 21:33:44

啊....包括50KB库只是为了'$（ '＃PLACEHOLDER1'）。ATTR（ 'SRC'）'代替'的document.getElementById（ 'placeholde1'）。src' –

和所有的其他好处它提供，但是，嘿，你就有权您的意见/喜好:)也许李不知道jQuery的，所以我只是把他介绍给东西，这将使他的生活更轻松：d –

感谢安东尼我”读过一些关于jQuery的只是从来没有使用过它：/ IM试图所有3个答案，会看到我拿到第一份工作:) – Lee

我不得不承认，我不知道了“的getAttribute”不够方法来解决它的跨浏览ř兼容性...

function showPic (whichpic) { 
    if (document.getElementById) { 
     if(document.getElementById('placeholder1').getAttribute("src") == "/images/blank.gif") { 
      document.getElementById('placeholder1').src = whichpic.href; 
     } else { 
      document.getElementById('placeholder2').src = whichpic.href; 
     } 
     if (whichpic.title) { 
      document.getElementById('desc').childNodes[0].nodeValue = whichpic.title; 
     } else { 
      document.getElementById('desc').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue; 
     } 
     return false; 
    } else { 
     return true; 
    } 
}

编辑：切换 '的.src' 到 '的getAttribute（ “SRC”）'

来源

2011-08-04 21:35:49

谢谢，这看起来像我想要的但由于某种原因不会占位符2当我点击另一个图像显示。 – Lee

它看起来像我忽略了从.src属性读取将返回文件的完整路径的事实。所以“http：//www.foo.com/path/to/image.jpg”而不是“/path/to/image.jpg”。为了解决这个问题：.getAttribute（“src”）而不是.src。编辑上面包括这一点。 –

存储参考在一个变量来PLACEHOLDER1。检查placeholder1的src以查看它是否是您提到的任何图像（在我的示例中，我使用正则表达式来完成此操作）。如果这些图像中的一个，重新分配您的变量的引用，PLACEHOLDER2：

function showPic (whichpic) { 
    var ph = document.getElementById('placeholder1'); 
    if (/[1-3]\.jpg/.test(ph.src)) { 
     ph = document.getElementById('placeholder2'); 
    } 
    ph.src = whichpic.href; 
    var descChild = document.getElementById('desc').childNodes[0]; 
    descChild.nodeValue = whichpic.title || whichpic.childNodes[0].nodeValue; 
}

注意，你并不需要测试的document.getElementById存在。如果浏览器支持JavaScript，则支持document.getElementById。

来源

2011-08-04 21:36:13 gilly3

简单的JavaScript帮助

回答

相关问题