javascript從另一個調用函數

Question

我有這個JS功能：

function addMemberToLessonDirect(id)
    {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $.ajax({
            method: 'POST', 
            url: '/admin/lessons/addMember/licenseMemberId', 
            data: {'licenseMemberId' : id},
            success: function(response){ 

                if ($.trim(response)) {
                    var actualMembers = document.getElementById("actual-member");

                    if (!$.trim(actualMembers)) {

                        $('#no_members').hide();
                        var div1 = document.createElement('div');
                        div1.setAttribute('class','table-responsive');
                        $('#space').append(div1);
                        var actualMembers = document.createElement('table');
                        actualMembers.setAttribute('class','table');
                        div1.append(actualMembers);
                    }

                    var newRow = actualMembers.insertRow(actualMembers.length);
                    newRow.setAttribute( "data-id",response['llm']['id']);
                    id = newRow.insertCell(0);
                    id.innerHTML = response['user_saved']['id'];
                    nip = newRow.insertCell(1);
                    nip.innerHTML = response['user_saved']['nip'];
                    update.innerHTML ="<a class='btn btn-info btn-xs edit' title='{{__('member.edit')}}'> <i class='fa fa-pencil'></i> </a>";
                }
                $('#membersModal').modal('hide');

            },
            error: function(jqXHR, textStatus, errorThrown) { // What to do if we fail
            }
        });

    }

該函數調用或創建一個表（實際成員）並添加行和列。 當我從具有的模態中選擇一個元素時，將調用此函數。 當我選擇模式中的元素時，該元素將添加到表中。

現在，此表還有另一個JS函數，使某些字段可編輯和可保存：

$("#actual-member tr").editable({

        keyboard: true,
        dblclick: true,
        button: true,
        buttonSelector: ".edit",
        dropdowns: {},
        maintainWidth: true,

        edit: function (values) {
            $(".edit i", this)
                .removeClass('fa-pencil')
                .addClass('fa-save')
                .attr('title', '{{__('member.save')}}');
        },
        save: function (values) {

            values._token = '<?php echo csrf_token(); ?>';


            //console.log(values);
            var lessonLicenseMemberId = $(this).data('id');
            $.post('/admin/lessons/editLessonLicenseMember/' + lessonLicenseMemberId, values);
        },
        cancel: function(values) {
            $(".edit i", this)
                .removeClass('fa-save')
                .addClass('fa-pencil')
                .attr('title', '{{__('member.edit')}}');
        }

    });

當我嘗試在未使用addMemberToLessonDirect函數創建的元素上單擊表中的編輯按鈕時，它可以很好地工作，但是當我單擊由addMemberToLessonDirect函數創建的元素上的相同按鈕時，則什么也沒有發生。 我認為他們沒有“屬性”可編輯（第二功能）。 是否可以從addMemberToLessonDirect函數調用可編輯函數？

Answer 1

使用addMemberToLessonDirect創建的元素是從ajax回調異步創建的。 這意味着您真的不知道它們何時可用於DOM並且可以肯定，當您調用$("#actual-member tr").editable({...時，它們不可用。在同步執行的代碼中。

您確實知道，在ajax調用之后執行回調時，它們success: function(response){ ...回調。

為此，您需要做的是添加與$("#actual-member tr").editable({到success: function(response){ ..的回調返回success: function(response){ ..邏輯相同的邏輯success: function(response){ ..