1

我早些时候发布了一个问题并得到了答案，感谢这里的好人，但幸运的是，它从来没有那么容易。我有一个代码可以在图片 onclick 之间来回切换，但是，第一次单击时，图片不会切换，但选中了复选框。至少推理会很棒:)

<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>
4

2 回答 2

2

您缺少“开”的第一个状态。尝试将此添加到您的标记中

 <img src="images/img1.jpg" width="781" height="800" onclick="func()" name="on" id="img1" />

相反，您可以在 javascript 中的条件语句中处理此问题，如下所示：

if(img1.name === undefined || img1.name == "on")

这将处理不存在名称属性的第一个状态。

于 2012-12-18T23:38:00.117 回答
1

由于您的img元素没有name属性，因此第一次单击它时它与“on”条件不匹配。您可以添加一个名称属性（这会起作用，但会使 html 无效），但更好的解决方案可能是从与之关联的复选框中获取值。像这样的东西：

var checkboxid = img1.parentNode.getAttribute("for");
document.getElementById(checkboxid).checked

这样，您可以确保它与复选框保持同步。

于 2012-12-18T23:46:08.620 回答