jq ajax获取数据动态添加，each遍历不到问题

问题描述：使用ajax获取数据动态添加，使用each遍历不到
问题原因：加载顺序问题，ajax还没执行完就使用each遍历了，肯定遍历不到
解决办法：在ajax执行成功后调用遍历的函数（在success里调用）

var page = {
    sTable:'',
    cTable:'',
    fixedHeaderOffset:0,
    init: function () { //页面初始化方法
        this.initProject();
    },

   //项目范围
initProject:function () {
    //获取项目
    $('#select-project').click(function () {
        if(!validate()) return ;

        var msg = tmpl("projectselector_tmpl", {
            selectMode: 0
        });

        bootbox.dialog({
            message: msg,
            title: "选择项目",
            onEscape: true,
            backdrop: true
        });
        // 搜索用户
        searProject();

        //项目是否已选择 
        //isCheckedProject(); //最开始是在这里调用检查项目（是否已选，已选就选上），由于searProject()是使用ajax请求数据并添加数据，此时调用searProject()，ajax还没执行到。在success里调用isCheckedProject()解决问题

        //切换房源类型
        $(document).on("click","#projectTableContainer .header ul li",selectType);

        //选择/取消选择项目
        $(document).on("click","#projectTableContainer table tbody tr",function () {
            if($(this).hasClass('checked')){
                $(this).removeClass('checked');
                $(this).find('.is-selected').text('');
            }else{
                $(this).addClass('checked');
                $(this).find('.is-selected').text('√');
            }
        });

        //全选项目
        $(document).on("click","#projectTableContainer .footer .select-all",function () {
            $('#projectTableContainer table tbody tr').each(function (i,o) {
                $(o).addClass('checked');
                $(o).find('.is-selected').text('√');
            });
        });

        //取消全选
        $(document).on("click","#projectTableContainer .footer .cancel-all",function () {
            $('#projectTableContainer table tbody tr').each(function (i,o) {
                $(o).removeClass('checked');
                $(o).find('.is-selected').text('');
            });
        });

        //确定选择，添加已选项目到项目范围
        $(document).on("click","#projectTableContainer .footer .select-project-btn",function () {
            var projectsContainer = $('#projects');
            $('#projectTableContainer table tbody tr').each(function (i,o) {
                if($(o).hasClass('checked')){
                    var data = $(o).data('project');
                    var item = '<div class="project-item"><span class="rm-item">x</span>'+data.name+'<input type="hidden" name="project_id[]" value="'+data.id+'"></div>'
                    projectsContainer.append(item);
                }
            });

            bootbox.hideAll();
        });

        //取消选择
        $(document).on("click","#projectTableContainer .footer .cancel-project-btn",function () {
            bootbox.hideAll();
        });

    });

    //验证公司、用户是否为空
    var validate = function(){
        var customer_id = $('#customer_id').val();
        var company_code = $('#company_code').val();
        var type = $('input[name="type"]:checked').val();
        var submit = true;
        var errortxt = '';
        if(type==2 && utils.isEmpty(company_code)){
            submit = false;
            errortxt += '请先选择企业';
        }
        if(utils.isEmpty(customer_id)){
            submit = false;
            errortxt += utils.isEmpty(errortxt) ? '请先选择用户': '<br/>请先选择用户';
        }
        if(!submit){
            $('#hid_select-project').html(errortxt);
            return false;
        }
        $('#hid_select-project').html(''); //已选择信息清空提示信息
        return true;
    };

    var projectTable = null;
    //查询用户信息
    var keyupHandle;
    var searProject = function () {
        var customer_id = $('#customer_id').val();
        var company_code = $('#company_code').val();
        var type = $('input[name="type"]:checked').val();
        var noDataTxt = utils.isEmpty(company_code)? '没有查询到项目，请重新选择用户': '没有查询到项目，请重新选择企业或用户';
        keyupHandle && clearTimeout(keyupHandle);
        keyupHandle = setTimeout(function () {
            if (!utils.isEmpty(customer_id)) {
                App.blockUI({
                    target: "#projectTableContainer",
                    message: "加载中..."
                });
                $.ajax({
                    type: "GET",
                    url: "/collection/query-projects",
                    data: {
                        customer_id: customer_id,
                        company_code: company_code,
                        type: type,
                    },
                    success: function (data) {
                        App.unblockUI("#projectTableContainer");

                        projectTable && projectTable.destroy();

                        var projectDataHTML = tmpl("project_data_tmpl", {
                            projects: data
                        });

                        $("#projectTableContainer").html(projectDataHTML);
                        projectTable = $('#projectTable').DataTable({
                            paging: false,
                            searching: false,
                            ordering: false,
                            info: false,
                            language: {
                                emptyTable: noDataTxt,
                            },
                        });
                        //开始是放在外面的
                        //项目是否已选择
                        isCheckedProject();
                    },
                    error: function () {
                        App.unblockUI("#projectTableContainer");
                        $("#userTableContainer").html('<div class="text-center">服务器异常，请稍后再试</div>');
                    }
                });
            } else {
                projectTable && projectTable.destroy();

                var projectDataHTML = tmpl("project_data_tmpl", {
                    projects: []
                });

                $("#projectTableContainer").html(projectDataHTML);
                    projectTable = $('#projectTable').DataTable({
                    responsive: true,
                    paging: false,
                    searching: false,
                    ordering: false,
                    info: false,
                    language: {
                        emptyTable: noDataTxt,
                    }
                });
            }
        }, 200);
    };

    //切换项目类别
    var selectType = function(){
        $(this).parent().children('li').removeClass('active');
        $(this).addClass('active');
        var type = $(this).data('type');
        $('#projectTable tbody tr').each(function (i,o) {
            if($(o).hasClass(type)){
                $(o).show();
            }else{
                $(o).hide();
            }
        });
    };

    //是否存在已选项目
    var isCheckedProject = function(){
        var projectIds = [];
        $('input[name="project_id[]"]').each(function (i,o) {
            projectIds.push($(o).val());
        })
        if(projectIds.length>0){
            console.log(projectIds);
            console.log($('#projectTableContainer table tbody tr'));

            $('#projectTableContainer table tbody tr').each(function (i,o) {
                var data = $(o).data('project');
                console.log(data);
                if($.inArray(data.id,projectIds)!=-1){
                    $(o).addClass('checked');
                    $(o).find('.is-selected').text('√');
                }
            });
        }
    };

    //删除项目
    $('.select-project-list').on('click','.project-item .rm-item',function () {
        $(this).parent().remove();
    });
},

}

page.init();

html

<!--项目-->
<script type="text/html" id="projectselector_tmpl">
    <div class="row">
        <div class="col-md-12" id="projectTableContainer"></div>
    </div>
</script>

<script type="text/html" id="project_data_tmpl">
    <div class="header">
        <ul>
            <?php foreach ($dept as $k=>$item){ ?>
                <li data-type="<?=$item['id']?>"><?=$item['alia_name']?></li>
            <?php } ?>
        </ul>
    </div>
    <table class="table table-bordered table-hover" id="projectTable" style="width:100%;">
        <thead>
        <tr>
            <th data-priority="1">项目名称</th>
            <th data-priority="2">选择</th>
        </tr>
        </thead>
        <tbody>
        <% for(var n in projects) {
        var project = projects[n];
        %>
        <tr data-project='<%=JSON.stringify(project)%>' id="<%=project.id || ''%>" class="<%=project.dept_id || ''%>">
            <td><%=project.name || ""%></td>
            <td class="is-selected"></td>
        </tr>
        <% } %>
        </tbody>
    </table>

    <div class="footer">
        <div class="radio-box">
            <div class="btn radio select-all">全部项目</div>
            <div class="btn radio cancel-all">取消全选</div>
        </div>
        <div class="foot-btn">
            <button type="button" class="btn select-project-btn">确定选择</button>
            <button type="button" class="btn default cancel-project-btn">取消选择</button>
        </div>
    </div>
</script>