onclick()javascript属性与复选框保持一致

时间:2013-01-06 22:31:05

标签: javascript html onclick

我在这里有一个非常简单的javascript程序,可以在点击时更改另一个图像的图像以显示它已被选中,但是我似乎无法使其与我的复选框保持同步,偶尔它会脱落同步并导致我的PHP表单问题

代码:

<script type="text/javascript">
function func()
{
    var img1= document.getElementById("img1");

    if(img1.name == "on")
    {
        img1.src = "images/" + "img1a.jpg";
        img1.name = "off";
    }
    else
    {
        img1.src = "images/" + "img1.jpg";
        img1.name = "on";
    }
}
</script>



</head>

<body>
<form>
<p align="center">
<input type="checkbox" name="interest1" id="interest1" value="x">
<input type="checkbox" name="interest2" id="interest2" value="x">
<input type="checkbox" name="interest3" id="interest3" value="x"></p>   
<p align="center">
<label for="interest1" id="label-interest1"><img src="images/img1.jpg" width="781" height="800" onclick="func()" id="img1" /></label>
<label for="interest2" id="label-interest2"><img src="/images/img2.jpg" width="781" height="800" /></label>
<label for="interest3" id="label-interest3"><img src="/images/img3.jpg" width="781" height="800" /></label></P><!-- code making checkbox be an image-->
</form>

1 个答案:

答案 0 :(得分:2)

您可以检查相应复选框的if(img1.name == "on")状态,而不是检查checkbox.checked

编辑:对于踢腿和咯咯笑,这是使用jQuery的jsFiddle示例。