Question

当我点击一个方框时，我已经制作了这段代码给我一个div：

JS

<script type="text/javascript">
var bool = 0;
function showDiv() {
    if (bool == 1) {
        bool = 0;
        document.getElementById('show').style.visibility = "hidden";
    } else if (bool == 0) {
        bool = 1;
        document.getElementById('show').style.visibility = "visible";
    }
}
</script>

HTML

<input type="button" value="click" onclick="showDiv();" />

<div id="show" style=" visibility:hidden;">
  <p>it is okay it is okay it is okay it is okay it is okay</p>
</div>

但是，如果我想点击图片来显示div，我该怎么做呢。

Answer 1

当您标记问题jquery时，我建议使用.toggle方法代替..

$('#yourimageid').click(function() {
   $('#targetelementid').toggle();
});

Answer 2

最简单的方法（根据你已有的方式）：

<img src="myimage.jpg" onclick="showDiv();"/>

但是如果你实际上正在使用jQuery，那么你可以使用.toggle方法，这意味着你不必费心去维护你的bool变量（它实际上应该是一个bool！）。 / p>

使用jQuery，你可以这样做：

$('#imageId').click(function() {
    $('show').toggle();
});

Answer 3

使用jQuery，您可以将代码简化为：

$('input,img').click(function() {
    $('#show').css('visibility', ($('#show').css('visibility') == 'visible') ? 'hidden' : 'visible');
});

<强> jsFiddle example

Answer 4

做

$('#imageId').click(showDiv);

将showDiv函数绑定到id为imageId的元素上的click事件。

参考：http://api.jquery.com/click/

点击show div，image

4 个答案: