Как сделать выбор чекбокса?

Question

[Anto]

Добрый день!

Подскажите: В выпадающем элементе есть чек бокс но его нельзя выбрать, так же встречаются кнопки Показать и Сбросить они тоже перестают работать, а форма с водомерке текста работает, подскажите где в коде ошибка?

jsfiddle.net/Antkaz/2ggntbwk/8

Answer 1

[Михаил Федотов]

У вас вся функция работает при клике на блок с классом news.
Каждый клик - это класс news, она запускается заново, а в конце выдает false.

Я бы повесил событие на h3 и сделал бы так:
var upDownElem = $('.news_info');

Comments

[Anto]

Подскажите пожалуйста как исправить. Сделал вроде как вы сказали но при клике на заголовок Новости раскрываются все элементы, стоит поставить чек бокс в одно из полей все сворачивается. Как сделать так чтобы при нажатии на заголовок Новости открывался один заголовок и выбирая чекбокс он тут же не сворачивался и при нажатии на область в не элемента он сворачивался.
jsfiddle.net/Antkaz/2ggntbwk/9

[Михаил Федотов]

ANTON K.:

$('.news').on('click', function() {
		var upDownElem = $(event.target.nextElementSibling);
    $('.news_info').slideUp()
    upDownElem.stop().slideDown();
    if((upDownElem) && (upDownElem.is(':visible'))) {
        return false;
    }
});

Я заложил здесь следующую идею:
При клике на .news (а мы помним, что .news перенесли на h3), мы берем соседний DOM-элемент (он же .news_info) и превращаем его в JQuery объект, чтобы можно было с ним работать. Ну, дальше и работаем по старинке.
Последнюю функцию я убрал, потому что она не используется в решении данной задачи.
Если нужно, чтобы меню сворачивалось, при нажатии на область вокруг, то используйте эту область. Сейчас функция выглядит так:

$(document).on('click', function() {
    $('.news_info').slideUp()
});

То есть при клике на весь документ, куда бы то ни было!. Нужно просто повесить событие onclick на другой DOM элемент.

[Anto]

Михаил: Добрый день, все сделал как сказано, изменил на:

$('.news').on('click', function() {
    var upDownElem = $(event.target.nextElementSibling);
    $('.news_info').slideUp()
    upDownElem.stop().slideDown();
    if((upDownElem) && (upDownElem.is(':visible'))) {
        return false;
    }
});

Но вот с закрытием списка при нажатии на область вне списка не разобрался, подскажите пожалуйста как это сделать