Javascript 向图像（背景图像）添加超链接

我有点不知道如何添加一个超链接到一个图像（背景图像），该图像将被调用到下面的HTML页面中：

<div style="background-color: #fff; background: #fff url(/affiliate/uploads/images/subs_bg_4e1a7912cf9a79.22853644.jpg) no-repeat right top" class="bigshadow" id="wrapper"></div>

我需要在背景图像中添加一个超链接。$（“#包装”）。单击（函数（）{here goes redirect}） 或者你只需要背景图像：

$('#wrapper').live('click',function(){
   location.href = "http://www.yoursite.com";
});

因为您的问题意味着div是动态添加到页面的，所以我会使用

---

如果确实要插入超链接（元素），可以执行以下操作：

$('#wrapper').append($('<a/>',{'html':'<br/>','href':'http://www.yoursite.com'}).css({'display':'block','height':'100%','width':'100%'}));

$（'#包装器'）。追加（$（''，{'html'：'
'，'href'：'http://www.yoursite.comcss（{'display'：'block'，'height'：'100%'，'width'：'100%}）；

---

您可能希望在类上运行所有这些，而不是在id上运行，这样它可以用于多个元素

在您的div中放置一个带有

display:block

的链接，如下所示：（此技巧即使在ie6,7,8中也有效）

html:

.

我不明白为什么它必须是一个带有背景图像的

。。。这只意味着，由于标记使用不当，您将陷入痛苦之城，试图迫使浏览器执行某些操作

您的问题不清楚您是否控制了该

的来源

如果您确实可以控制是什么创建了该

，我建议将其更改为

，并将其包装在锚（

）标记中：

如果您无法控制

的创建，那么我建议从中提取图像URL并使用适当的语义标记

无论哪种情况，以下都是您应该瞄准的标记：

<a href="#" id="wrapper" class="bigshadow">
     <img src="/affiliate/uploads/images/subs_bg_4e1a7912cf9a79.22853644.jpg" />
</a>

---

不可能。考虑添加一个<代码> OnCouter < /C> >甚至到<代码> div <代码>。将onclick侦听器添加到div。单击图像时，事件将冒泡到div。是否有任何原因使得

不能只是一个锚（

）标记本身，并带有href，或者背景图像可能只是一个包裹在

中的

标记？为什么还要麻烦将img.jpg作为背景图像添加到锚和

？为什么不创建一个锚并在其内部放置一个

，或者用

包装

？没错，背景图像只能在div上（编辑我的答案），谢谢您的评论。chris，我不能使用click函数，因为包装器div是模板中的主div。

#wrapper a {
    display: block;
    height: 101px;
    width: 100%;
}

<a href="#" id="wrapper" class="bigshadow">
     <img src="/affiliate/uploads/images/subs_bg_4e1a7912cf9a79.22853644.jpg" />
</a>

function extractImageUrl(html) {
    return $(html).css('background-image').replace(/url\(\"(.*?)\"\)/, "$1");
}