Question

我在缩略图下有复选框，在这里：http://jsfiddle.net/pAYFa/我想通过点击缩略图来执行此操作，复选框已选中。我认为这可以通过javascript完成，我会在javascript中使用任何帮助。感谢。

Answer 1

只需将图片放入标签，然后删除重复的ID即可。我已经完成了第一个：http://jsfiddle.net/karim79/pAYFa/1/

根据specification，文档中的每个ID都必须是唯一的。

Answer 2

嗯，最简单的方法是在图片周围贴上标签。这将完全符合您的要求：

<label for="img1"><img class="img" src="http://s5.tinypic.com/30v0ncn_th.jpg" /></label>
<input type="checkbox" class="chk " checked="checked" id="img1" name="img1" value="0" />

不需要javascript！您必须从id="img1"标记中删除<img>，因为您不能拥有多个具有相同ID的元素。

Answer 3

如上所述，如果您对如何将事件处理程序附加到图像感到好奇，则无需通过javascript进行操作。您需要将复选框ID更改为图像ID以外的其他ID。我将其重命名为chk2

document.getElementById('img2').onclick = function () //attach to onclick
{                             
        var checkbox = document.getElementById('chk2'); //find checkbox

        checkbox.checked = !checkbox.checked; //toggle the checked status
}

Answer 4

使用jQuery这是孩子的游戏：

$('img').click(function(){
  $(this).next().click();
})

没有，它变得有点困难。我给了你的复选框唯一ID（img1_cb和img2_cb）并为每个图像添加了一个点击处理程序，例如：

<img class="img" src="http://s5.tinypic.com/30v0ncn_th.jpg" id="img1" onclick="toggle('img1_cb')" />

然后JavaScript是：

function toggle(what){
  var cb = document.getElementById(what);
  cb.checked = !cb.checked;  
}

单击图像选中复选框

4 个答案: