单击一个div并获取值时禁用同级div

Question

When I click on one of the DIV it will find the check-box inside the DIV and "Check" it. So the other DIV will hide. I am facing problem on How do I disable other DIV When the time it is hiding itself or else I can click other DIV and broke the initial idea by only left the DIV that is clicked.

2)How do I get the value of the checked div ?

3)How do I detect if no check-box were selected ??

TQ

 <div id="answer">
    <h3>A</h3>
    <p id="result">Tick the correct answer</p>
    <div id="a1">A. <input type="checkbox" value="1" name="ans" ></input></div>
    <div id="a2">B. <input type="checkbox" value="2" name="ans"></input></div>
    <div id="a3">C. <input type="checkbox" value="3" name="ans"></input></div>
    <div id="a4">D. <input type="checkbox" value="4" name="ans"></input></div>
    </div>

    <button id="checkbtn">Check Answer</button>


var btncounter = 0;
$("#checkbtn").hide();
$("#answer > div").click(function (e) {
e.stopPropagation();
    var status = $(this).find("input:checkbox").prop('checked'); 
    $(this).find("input:checkbox").prop("checked", !status);
    $(this).siblings('div').slideToggle(!status);
    btncounter++;
    if(btncounter%2 == 1)
    $("#checkbtn").show();
    else
    $("#checkbtn").hide();
});

Answer 1

Try like this,

$("#checkbtn").hide();
$("#answer > div").click(function (e) {
    $(this).find("input[type=checkbox]").trigger("click");

});
$("input[type=checkbox]").click(function (e) {

    $(this).parent().siblings('div').slideToggle();
    $("#checkbtn").toggle();

    e.stopPropagation();
});

Fiddle

Edit

    var btncounter = 0;
$("#checkbtn").hide();
$("#answer > div").click(function (e) {
    if (!$(this).find("input[type=checkbox]").attr("disabled")) {
        $(this).find("input[type=checkbox]").trigger("click");
    }
});
$("input[type=checkbox]").click(function (e) {
    $("input[type=checkbox]").not(this).attr("disabled", true);
    $(this).parent().siblings('div').stop().slideToggle("slow", function () {
        $("input[type=checkbox]").not(this).removeAttr("disabled");
    });
    $("#checkbtn").toggle();

    e.stopPropagation();
});

$("#checkbtn").click(function(){
   alert($("input[type=checkbox]:checked").parent().text());
});

Updated fiddle

Answer 2

Try

$("#checkbtn").hide();

var $checks = $("#answer > div input:checkbox").change(function (e) {
    $divs.stop(true);

    var $div = $(this).parent();
    var $sibs = $divs.not($div)[this.checked ? 'slideUp' : 'slideDown']();
    $div.slideDown();

    $sibs.find('input:checkbox').prop('checked', false);
    $("#checkbtn").toggle($checks.filter(':checked').length > 0);
})

var $divs = $("#answer > div").click(function (e) {
    if (!$(e.target).is('input')) {
        $(this).find("input:checkbox").prop("checked", function (i, checked) {
            return !checked;
        }).change();
    }
});

Demo: Fiddle