在單擊顯示格，圖像

我做了這個代碼給我一個div當我點擊一個框：在單擊顯示格，圖像

<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時，我是否會這樣做？

來源

2012-10-09 Adnaves

當你標記您的問題jQuery的，那麼我建議使用.toggle方法，而不是..

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

來源

2012-10-09 18:39:47

'.toggle（）切換顯示屬性，而不是可見性屬性。 – j08691

這是一個很好的觀點（即使我懷疑它對OP很重要）.. +1對你的回答 –

我很抱歉，但我仍然不明白。我想要發生的事情是，當我點擊圖像時。文本將出現。現在，這個文本是另一個div。當您進入該網站時，它是隱藏的，只有當您點擊圖片時纔會顯示。 – Adnaves

做

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

要綁定id爲圖像標識的元素有關的showDiv功能的click事件。

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

來源

2012-10-09 18:39:16

最簡單的方式（因爲你已經擁有）：

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

但是如果你真的在使用jQuery，那麼你可以使用.toggle方法，這意味着你不必費心維護你的bool變量（這實際上應該是一個布爾！）。

使用jQuery，你可以做這樣的事情：

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

來源

2012-10-09 18:40:09

.toggle（）切換顯示屬性，而不是可見性屬性。 – j08691

@ j08691：那麼？效果是隱藏元素，這是想要的。如果您真的需要切換可見性而不是顯示，可以使用toggleClass。 –

使用jQuery可以減少你的代碼，只是這樣的：

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

jsFiddle example

來源

2012-10-09 18:47:24 j08691

在單擊顯示格，圖像

回答

相關問題