Question

我目前停留在正在编写的插件的前端。我试图将针对HTML表行元素（hide（），show（））和传单地图上的标记的过滤器函数的执行推迟到创建它们之后，但是Firefox始终会给我错误

TypeError：job.tableRow未定义

如果我注释掉tableRow的创建，则传单图上的标记会出现完全相同的问题。

我已经阅读了很多有关jQuery延迟对象的信息，并尝试了两种或三种方法来实现它们，但是似乎我仍然缺少一些重要的东西。

有效的方法：页面完全加载后，我可以手动过滤列表中和地图上显示/隐藏的作业。

但是，如果我尝试进行一些初始过滤，则会收到错误消息。似乎在创建tableRow之前执行了过滤功能。

所以我当前的代码如下：

//inside the "main" function

if(jobs != null){
    /* this code works
       createMarkers(jobs);   
       createJobTable(jobs, tableBody);
    */
    //but like this it does not
    $.when( createMarkers(jobs), createJobTable(jobs, tableBody)).done(filterJobs);


function filterJobs(){

    ...

    //go through array of jobs and hide markers and list entry of those, with status that is not checked
    for (i = 0, max = jobs.length ; i < max; i++){
        job = jobs[i];
        if (shownJobStatus.includes (job['status']) ){
            job.tableRow.show();
            job.marker.addTo(jobmap);
        }
        else {
            job.tableRow.hide();
            job.marker.remove();
        }
    }
}

function createMarkers(jobs){

    jQuery(function($){
        var deferred = $.Deferred();

        for (i = 0; i < jobs.length; i++){

            //extract lat, lon, ... from job, I leave out again
            job.marker = L.marker([lat, lon], {icon: markerIcon}).addTo(jobmap);
            job.marker.bindPopup(jobName).openPopup();
        }

        deferred.resolve();
        return deferred;
    })
}


function createJobTable(jobs, tableBody){

    jQuery(function($){

    let promiseArray = [];

    for (i = 0; i < jobs.length; i++){
        job = jobs[i];
        promiseArray.push( createJobTableEntry(job, tableBody) );
    }
    deferred.resolve();
    return Promise.all(promiseArray); 

    })
}

function createJobTableEntry(job, tableBody){

    jQuery (function($){

        let defer = $.Deferred();

        const jobId = job['id'];

        job.tableRow = $("<tr></tr>");
        tableBody.append(job.tableRow);

        //put lots of stuff in the table like this
        job.tableRow.append($("<td></td>").text(job.jobName));

        //lots of user-role dependant stuff 

        defer.resolve();
        return defer.promise();

    })
}

我以为是线

$.when( createMarkers(jobs), createJobTable(jobs, tableBody)).done(filterJobs);

仅在推迟解决createMarkers和createJobTable返回之后，才应执行filterJobs（）。仅在创建所有元素之后才解决延迟问题。那么为什么这不起作用？

jQuery延迟的用法不会延迟函数的执行

0 个答案: