怎样才能改变一个标签的背景图像使用css与javascript

Question

这是一个真正的头痛，我有三个复选框的形式，我有标签，并且标签有背景图像设置与cess，问题是什么时候，我怎么得到我的JavaScript改变图像从curent图像到第二个图像，当它被点击并选择复选框，从我所知道的JavaScript，它的工作，任何想法？此外，它也必须是这样的，由于以前的问题与IE 7和8

HTML：

<input type="checkbox" name="interest1" id="interest1" value="interested"style="display:block"> 
    <input type="checkbox" name="interest2" id="interest2" value="interested"style="display:block"> 
    <input type="checkbox" name="interest3" id="interest3" value="interested"style="display:block"> 
    <p align="center"> 
    <label for="interest_inet" id="label-interest1" onClick="func()"></label> 

CSS：

label { 
    border:1px solid red; 
    display:inline-block; 
} 

#label-interest1 { 
    background-image: url(images/internetbutton.gif); 
    width: 152px; 
    height:152px; 
} 

的javascript：

<script type="text/javascript"> 
function func() 
{ 

if(document.getElementById('interest_inet').checked) 
{ 
    document.getElementById('label-interest1').style.backgroundImage=url(images/internetbutton.gif); 
} 
else 
{ 
    document.getElementById('label-interest1').style.backgroundImage=url(internetbuttonchecked.gif); 
} 
} 
</script> 

这里现场代码示例：http://jsbin.com/uburan/11/edit

Answer 1

你似乎只是缺少一些引号（的style.backgroundImage的值应该是一个字符串）：

function func() 
{ 
    var label = document.getElementById('label-interest1'); 
    if(document.getElementById('interest_inet').checked) 
    { 
     label.style.backgroundImage = 'url(images/internetbutton.gif)'; 
    } 
    else 
    { 
     label.style.backgroundImage = 'url(internetbuttonchecked.gif)'; 
    } 
}