jQuery實(shí)現(xiàn)點(diǎn)擊DIV同時(shí)點(diǎn)擊CheckBox,并為DIV上背景色的實(shí)例
廢話不多說,直接上代碼吧
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>JqueryTest</title>
<script src="js/jquery-1.8.3.min.js"></script>
<script>
$(document).ready(function () {
$('input').click(function(e){
e.stopPropagation();
var parent = $(this).parent();
$(this).is(':checked') ? parent.css('background-color','#CCC') : parent.css('background-color','#FFF');
});
$('div').click(function(){
$(this).find(':checkbox').click();
if($(this).css('background-color') == 'rgb(255, 255, 255)'){
$(this).css('background-color', '#CCC');
}else{
$(this).css('background-color', '#FFF');
}
});
});
</script>
</head>
<body>
<div>
<input type="checkbox" />A
</div>
<div>
<input type="checkbox" />B
</div>
<div>
<input type="checkbox" />C
</div>
</body>
</html>
效果截圖:

以上這篇jQuery實(shí)現(xiàn)點(diǎn)擊DIV同時(shí)點(diǎn)擊CheckBox,并為DIV上背景色的實(shí)例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
juqery 學(xué)習(xí)之三 選擇器 可見性 元素屬性
juqery 學(xué)習(xí)之三 選擇器 可見性 元素屬性,需要的朋友可以參考下。2010-11-11
jQuery實(shí)現(xiàn)表格與ckeckbox的全選與單選功能
先給大家介紹下jQuery實(shí)現(xiàn)表格與ckeckbox的全選與單選功能,以及通過js實(shí)現(xiàn)隱藏與顯示銨鈕功能的實(shí)例代碼,需要的朋友參考下吧2016-11-11
jQuery ajax調(diào)用webservice注意事項(xiàng)
這篇文章主要為大家詳細(xì)介紹了jQuery ajax調(diào)用webservice的注意事項(xiàng),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-10-10
jQuery Jcrop插件實(shí)現(xiàn)圖片選取功能
今天我們要在ASP.NET中用jQuery.Jcrop插件實(shí)現(xiàn)圖片的選取功能,你想選取美女的哪個(gè)部位你說了算,我就管不著了2011-11-11
jQuery+formdata實(shí)現(xiàn)上傳進(jìn)度特效遇到的問題
這篇文章主要介紹了jQuery+formdata實(shí)現(xiàn)上傳進(jìn)度特效遇到的問題的相關(guān)資料,需要的朋友可以參考下2016-02-02
jQuery選擇器_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
選擇器是jQuery的核心,一個(gè)選擇器寫出來類似$('#dom-id')。下面給大家分享jQuery選擇器的相關(guān)知識(shí),感興趣的朋友一起看看吧2017-07-07

