Проблема с behaviors jquery

Главные вкладки

Аватар пользователя bazavr bazavr 21 февраля 2018 в 11:57

Здравствуйте, есть небольшая проблема. На страницу подключаю js файл, в котором описываю behaviors. Проблема конкретно с behaviors.phone_cheked_parent функцией $('.checked-parent').click(function() . При клике событие клика происходит несколько раз (т.е. заходит сразу и в if и в else), пробовал добавлять once, но не помогло, как можно исправить ситуацию?

(function ($) {
    Drupal.behaviors.edit_button_text = {
        attach: function (context, settings) {

   $('#edit-field-email-und-add-more').text('Добавить');
 
   $('#edit-field-auto-number-und-add-more').text('Добавить');

   $('#edit-field-mf-contacts-und-add-more').text('Добавить');

        }
    }
})(jQuery);

(function ($) {
    Drupal.behaviors.phone_cheked = {
        attach: function (context, settings) {

     $('#user-edit-page .row-phone .block-content tbody tr td:nth-child(2) div:nth-child(2) input').click(function () {
            $('input:not(:checked)').parent().removeClass("checked-phone");
            $('input:checked').parent().addClass("checked-phone");
        });
        $('input:checked').parent().addClass("checked-phone");

 
        }
    }
})(jQuery);

(function ($) {
    Drupal.behaviors.phone_cheked_parent = {
        attach: function (context, settings) {

     $('#user-edit-page .row-phone .block-content tbody tr td:nth-child(2) div:nth-child(2)').click(function () {

            $('label').not( ".control-label.checked-phone").parent().removeClass("checked-parent");
            $('.control-label.checked-phone').parent().addClass("checked-parent");

                $('.checked-parent').click(function() {

                        if ($(this).siblings().hasClass('to-hide')) {
                                console.log($(this).siblings().hasClass('to-hide'));
                                $(this).siblings().removeClass('to-hide');
                        } else {
                                $(this).siblings().addClass('to-hide');
                                console.log($(this).siblings());
                        }

                });

        });

        $('.control-label.checked-phone').parent().addClass("checked-parent");
                $('.checked-parent').siblings().addClass("to-hide");
 
        }
    }
})(jQuery);

Комментарии

Аватар пользователя bumble bumble 21 февраля 2018 в 12:41

Используйте once():

$('.checked-parent').once().click(function() {
  if ($(this).siblings().hasClass('to-hide')) {
    console.log($(this).siblings().hasClass('to-hide'));
    $(this).siblings().removeClass('to-hide');
  } else {
    $(this).siblings().addClass('to-hide');
    console.log($(this).siblings());
  }
});
Аватар пользователя bazavr bazavr 21 февраля 2018 в 13:00

не подходит, срабатывает первый раз только один клик, а если кликать снова то по два клика как и было генерируется

Аватар пользователя bumble bumble 21 февраля 2018 в 13:09

А, сорри, не прочитал внимательно кода.
У Вас, зачем-то, 2 клика, должно хватить 1го.
Нужно либо к вот этой вот простыне once лепить:

$('#user-edit-page .row-phone .block-content tbody tr td:nth-child(2) div:nth-child(2)').click

Или выводить отдельно из-под нее этот ивент клика:

$('.checked-parent').click

И в нем уже once().

Аватар пользователя bazavr bazavr 21 февраля 2018 в 13:22

к простыне лепил once - не помогло. Если эту часть $('.checked-parent').click вынести то работать будет также, два события происходит, и выносить ее нельзя оттуда, они друг без друга не могут

Аватар пользователя bazavr bazavr 21 февраля 2018 в 13:34

да вот я тоже в это со вчерашнего дня не верю но есть как есть. Я вешал часть которая после else на dblclick, тогда по клику у нас с рабатывает одно, а по двойному - второму и все корректно работает, но вот беда, нужно чтобы было по одному клику)

Аватар пользователя bazavr bazavr 21 февраля 2018 в 15:25

структура примерно такая jsfiddle .

Основа: у нас есть структура div(группа радиокнопок)->div(радиокнопка, их много)->label->input

Идея: если радиокнопка нажата то остальные в текущей группе будут скрыты. Если нажать на радиокнопку которая выбрана то появяться остальные, если после этого тыкнуть на любой другой в группе или же на это то они скроются за исключением выбранной.

Что есть:

  1. При загрузке страницы label получает класс checked-phone если внутри label у нас радиокнопка которая выбрана.
  2. При загрузке страницы родитель у label получает класс checked-parent в том случае если у label есть класс chacked-phone.
  3. При загрузке страницы все родственники chacked-parent получат класс to-hide (чтобы скрыть их)
  4. При клике на радиокнопки в группе классы checked-phone и checked-parent удаляются если кнопка больше не выбрана и добавляются на ту кнопку которую выбрали.

Если в части $('.checked-parent').click(function() убрать else то имеем:

  1. При нажатии на кнопку с классом chacked-parent произойдет проверка есть ли у родственников класс to-hide, если да то у родственников он удалится.

Чего не хватает:

  1. Если у родственников chacked-parent нету класса to-hide и происходит клик по нему или его родственникам, то нужно добавить класс to-hide всем элементам группы за исключением элемента с классом chacked-parent