Question

У меня сейчас проблема с получением значения children-id, которое я передаю элементу. Основная проблема здесь в том, что я могу получить значение только в том случае, если функция щелчка находится внутри l oop, и если я щелкну по тегу, он будет предупреждать 3 раза или больше, чем предупреждение, потому что функция при щелчке находится внутри l oop. Есть ли способ решить проблему, если я удалю функцию щелчка внутри l oop?

Основная цель: предупредить значение атрибута data-attri-children-id, если я нажму подкатегорию только за 1 раз, не более 1.

Чтобы лучше понять, я покажу вам свой образец кода, который я уже создал, и показанный результат.

Html 2 Страница Родительская страница / Дочерняя страница:

<ul id="tree1">
@foreach($categories as $category)
    <li data-attri-parent_id="{{$category->id}}">
        {{ $category->title }}
        @if(count($category->childs))
            @include('/SuperAdmin/manage_child',['childs' => $category->childs])
        @endif
    </li>
@endforeach

    <ul>
@foreach($childs as $child)
    <li data-attri-children-id="{{$child->parent_id}}">
        {{ $child->title }}
    @if(count($child->childs))
            @include('/SuperAdmin/manage_child',['childs' => $child->childs])
        @endif
    </li>
@endforeach
</ul>

Скрипт:

    $.fn.extend({
    treed: function (o) {

        var openedClass = 'far fa-minus-square';
        var closedClass = 'far fa-plus-square';

      if (typeof o != 'undefined'){
        if (typeof o.openedClass != 'undefined'){
        openedClass = o.openedClass;
        }
        if (typeof o.closedClass != 'undefined'){
        closedClass = o.closedClass;
        }
      };

        //initialize each of the top levels

        var tree = $(this);

        tree.addClass("tree");


        tree.find('li').has("ul").each(function () {

            var branch = $(this); //li with children ul

            branch.prepend("<i class=' " + closedClass + "'></i>");

            branch.addClass('branch');

            tree.find('li').not('li.branch').css( "cursor", "pointer" );

            // tree.find('li').not('li.branch').addClass('last');
            $('tree > li:not(.branch) li').addClass('last');

            tree.find('li').not('li.branch').attr('data-toggle', 'modal');
            tree.find('li').not('li.branch').attr('data-target', '#parentModal');

            branch.on('click', function (e) {
                if (this == e.target) {
                    var icon = $(this).children('i:first');

                    icon.toggleClass(openedClass + " " + closedClass);

                    tree.find('li.branch').removeClass('last');

                    tree.find('li.branch').css( "cursor", "text" );
                    tree.find('li.branch').addClass( "cursor", "text" );

                    tree.find('li.branch').removeAttr('data-toggle', 'modal');
                    tree.find('li.branch').removeAttr('data-target', '#parentModal');



                    $(this).children().children().toggle();

                    if (branch.find('li').last()) {
                        branch.find('li').last().css( "cursor", "pointer" );
                        branch.find('li').last().addClass('last');
                        branch.find('li').last().attr('data-toggle', 'modal');
                        branch.find('li').last().attr('data-target', '#childrenModal');
                    }
                }
            })


            branch.children().children().toggle();

            $(branch.find('li').last()).on('click',function(){
                alert($(this).attr('data-attri-children-id'));
            });

        });



        // $(('li').last()).on('click',function(){
        //     alert($(this).attr('data-attri-children-id'));
        // });

        $(tree.find('li').not('li.branch')).on('click',function(){
            alert($(this).attr('data-attri-parent_id'));
        });





        //fire event from the dynamically added icon
        tree.find('.branch .indicator').each(function(){
            $(this).on('click', function () {
                $(this).closest('li').click();


            });
        });

        //fire event to open branch if the li contains an anchor instead of text
        tree.find('.branch>a').each(function () {
            $(this).on('click', function (e) {
                $(this).closest('li').click();
                e.preventDefault();
            });
        });
        //fire event to open branch if the li contains a button instead of text
        tree.find('.branch>button').each(function () {
            $(this).on('click', function (e) {
                $(this).closest('li').click();
                e.preventDefault();
            });
        });
    }
});

//Initialization of treeviews

$('#tree1').treed();

Первая иллюстрация Нет Пока нажали: