JQuery Toggle+ Click Meyham
How to handle both toggle() and click() in jquery simulatenously
HTML
<div id="container">
<div class="option">option 01
<input type="checkbox" class="option"/>
</div>
<div class="option">option 02
<input type="checkbox" class="option"/>
</div>
<div class="option">option 03
<input type="checkbox" class="option"/>
</div>
</div>
<input type="checkbox" id="none"/>None
<div class="msg"></div>
CSS
div.option{width:100px;height:100px;border:1px solid #000; float:left; margin:2em;padding:.5em;background:#CCC;}
JavaScript
$(function() {
var turnOn = function() {
$('.msg').html('1');
$(this).find('input[type="checkbox"]').attr('checked', true);
$('#none').attr('checked', false);
};
var turnOff = function() {
$('.msg').html('2');
$(this).find('input[type="checkbox"]').attr('checked', false);
};
$('div.option', '#container').toggle(turnOn, turnOff);
$('#none').click(function() {
if ($(this).attr('checked')) {
$('div.option').find('input[type="checkbox"]:checked').parent().click();
$('#none').attr('checked', true);
}
});
});
$("#none").click(function() {
if ($("#none").attr("checked") == "checked") //IF "NONE OF THESE" IS CHECKED!
{
var parentsOfSelectedOptions = $( /*<<selector to get parent>>*/ );
$(parentsOfSelectedOptions).each(function(item) {
$(item).click();
});
//other actions
}, function() {
//other actions
}
});