jQuery + несколько флажков: Показать div на отмеченном, Скрыть на снятом

Question

Я получил несколько флажков, сгенерированных из скрипта PHP.

<input type="checkbox" class="checkbox" name="item[]" value="1" />

<input type="checkbox" class="checkbox" name="item[]" value="2" />

<input type="checkbox" class="checkbox" name="item[]" value="3" />

<input type="checkbox" class="checkbox" name="item[]" value="4" />

Теперь, когда флажок установлен, я хочу показать div с такими параметрами, как «Удалить выбранное». Но после того, как все флажки сняты, DIV должен снова исчезнуть. У меня есть следующий код, но он не скрывает DIV.

    $(".checkbox").live('click', function () {

        countChecked () ;

        if (countChecked() == "1" ) {

            $("div#options").fadeOut("medium") ;

        } else {

            if ( $("div#options").is(":hidden") ) {

                $("div#options").fadeIn ( "medium" ) ;

            }

        }

    });

Также ниже показана функция countChecked.

    function countChecked() {

        var n = $("input.checkbox:checked").length;

    }

Answer 1

Ваша функция должна вернуть значение:

function countChecked() {
    return $("input.checkbox:checked").length;
}

И вы хотите проверить, равна ли сумма 0 , также вы можете удалить повторный вызов на countChecked

$(".checkbox").live('click', function () {
    if (countChecked() == 0 ) {

Answer 2

Другая версия, с крошечной оптимизацией: http://jsfiddle.net/Briganti/XNWEP/

Веселитесь:)

Answer 3

Рабочая: http://jsfiddle.net/NkkJF/

Answer 4

Вы можете использовать

$('.checkbox').live('click',function(){
    // if you just checked the current one, no need to check the rest
    if (this.checked)
    {
      $('#options').fadeIn('medium');
    }
    else // if you just unchecked
    {
        if ( !$('.checkbox:checked').length ) // check the whole group
        {
            $('#options').fadeOut('medium');
        }
    }
});

демо на http://jsfiddle.net/gaby/wZWbS/

Answer 5

в вашей countChecked() -функции, используйте оператор return ..

 function countChecked() {

        var n = $("input.checkbox:checked").length;
        return n;

    }

и, нажимая на флажки ...

 $(".checkbox").live('click', function () {

        if (countChecked() == 0 ) {

            $("div#options").fadeOut("medium") ;

        } else {

            if ( $("div#options").is(":hidden") ) {

                $("div#options").fadeIn ( "medium" ) ;

            }

        }

    });