Jquery предотвращает запуск складного набора

У меня есть переключатель и несколько складных наборов на моей странице, и вот что я хочу сделать:

1) При развертывании/сворачивании одного аккордеона я хочу, чтобы значение переключателя не было выбрано (похоже, это работает нормально)

2) При изменении значения переключателей я хочу, чтобы он либо разворачивал все, либо закрывал все мои аккордеоны и выделял соответствующее значение переключателя. Однако, когда я меняю значение переключателя «Открыть все аккордеоны» или «Закрыть все аккордеоны», используя этот код

$('input[name="expand-collapse"]').change(function(e){

    var val = this.value;

    if (val=='open'){

        $('.ui-collapsible-set').children().collapsible('expand');

    } else if (val=='close'){

        $('.ui-collapsible-set').children().collapsible('collapse');

    }

});

код:

$(".menu").on("collapsibleexpand", function( event, ui )

стреляет, что не выделяет мою радиокнопку. Как я могу предотвратить срабатывание складного набора при изменении кода?

Вот мой код jsfiddle:

https://jsfiddle.net/q5haz642/7/

Я пробовал e.stopPropagation() для переключателя в событии изменения, но это не сработало.

Любая помощь будет здорово.

Спасибо


jquery jquery-mobile jquery-mobile-collapsible
person Moxie C    schedule 07.12.2016    source источник
comment
1) При развертывании/сворачивании одного аккордеона я хочу, чтобы значение переключателя не было выбрано (похоже, это работает нормально) - похоже, это не работает в вашей скрипке, может вы это подтверждаете? Когда я открываю один аккордеон, флажок «Закрыть все аккордеоны» по-прежнему проверяется.   -  person zgood    schedule 07.12.2016
comment
@zgood, я обновил скрипку: jsfiddle.net/q5haz642/7 при открытии/закрытии одиночный аккордеон, радиокнопка теперь не будет выделена   -  person Moxie C    schedule 07.12.2016

Ответы (1)


arrow_upward
0
arrow_downward

Для вашей проблемы я создал переменную javascript с именем toggleAll, которая является логическим значением, для которого будет установлено значение true только при нажатии флажка... а затем возвращается значение false.

Я переместил логику «снять флажок» в отдельную функцию для упрощения управления, а затем проверит это логическое значение, чтобы определить, следует ли снимать флажки или нет.

JS:

var toggleAll = false;
$('input[name="expand-collapse"]').change(function(e) {
  var val = this.value;
  toggleAll = true;

  if (val == 'open') {
    $('.ui-collapsible-set').children().collapsible('expand');
  } else if (val == 'close') {
    $('.ui-collapsible-set').children().collapsible('collapse');
  }

  toggleAll = false;
});

$(".menu").on("collapsibleexpand", function(event, ui) {
  uncheck();
}).on("collapsiblecollapse", function(event, ui) {
  uncheck();
});

function uncheck() {
  if (!toggleAll) {
    var $input = $('input[name="expand-collapse"]');
    $input.prop('checked', false);
    $input.checkboxradio('refresh');
  }
}

Вот рабочая скрипта.

person zgood    schedule 07.12.2016