Javascript 单击链接时显示图像

我希望当用户单击某个看起来像#foo的链接时，页面上会显示一个图像。范例

<a href="#dog">Dog</a>
<a href="#cat">Cat</a>

如果url包含#dog，它将显示一张狗的图片。如果url包含#cat，它将显示一张cat的图片。如何才能做到这一点。然后在图像标签中显示图像

<img id="something" />

编辑：我正在考虑在单击链接id之前隐藏所有图像。然后是获取url并确定要显示哪个图像的人。最重要的部分是从识别URL开始

我想要实现的sudo代码想法

    if url = #dog then 
    display in idelement dog.jpg 
    else if url = #cat then  
    display in idelement cat.jpg 
    else display defualt.jpg


<img id="idelement" />

如果url=#那么
在idelement dog.jpg中显示
否则，如果url=#cat then
在idelement cat.jpg中显示
else显示defualt.jpg

我在这里举了一个例子，但它忽略了您希望如何显示图像：

$（'a'）。每个（函数（）{
$（此）。单击（函数（e）{
var imgUrl=$（this）.attr（“href”）；//图像的url，您可以将其保存到a标记的其他位置
警报（imgUrl）；
//在此处显示所需的图像
e、 预防默认值（）；
返回false；
})
})

这里是代码的重构版本：您不需要像这样循环。。。jQuery会将事件绑定到选择器指定的每个可用标记。好的，所以我不想要警报框，所以我只需删除警报（imgUrl）。我会做些什么吗image1.png；image2.pngyippee我在堆栈溢出上找到了一个解决方案

<a href="#foo" >#foo....</a>
<a href="#cat" >#cat....</a>

$('a').each( function() {
    $(this).click( function(e) {
        var imgUrl = $(this).attr("href"); // url of the image, you can save it somewhere else into the a Tag
        alert(imgUrl);
        // display here the image where you want
        e.preventDefault();
        return false;
    })
})