0

我需要遍历 div 并使用 promise 模式加载它们,但显然只有上次调用的数据才会显示。

这是我的代码

$('div[class=ceTable]').each(function () {
    var position = $(this).position();
    gridID = $(this).attr('id')
    tableID = $(this).attr("data-tableid")
    docId = $(this).attr("data-docid")
    headerFound = $(this).data("headerFound")
    headerArray = $(this).data("headerArray")
    columnCount = $(this).data("columnCount")

    $.ajax({
        type: "GET",
        dataType: "json",
        url: "ajaxGetTableData",
        data: {
            'docID': docId,
            'tableID': tableID
        },

        beforeSend: function () {
            $('#' + gridID).block({
                css: {
                    border: 'none',
                    padding: '15px',
                    backgroundColor: '#36a9e1',
                        '-webkit-border-radius': '10px',
                        '-moz-border-radius': '10px',
                    opacity: 5,
                    color: '#fff'
                },
                message: 'Loading Grid'
            });
        }

    }).done(function (data) {
        console.log(data, "ajaxGetTableData")
        ceFeature.generateGridFromJSONObject({
            tabledata: data,
            columnCount: columnCount,
            gridID: gridID,
            headerArray: headerArray,
            headerFound: headerFound
        })
        $('#' + gridID).unblock();
    })
4

2 回答 2

3

您的变量是隐式全局的(因为您忘记了var关键字),因此每次迭代都会覆盖以前的值。异步回调将只访问最后一个然后 -循环问题中的典型创建函数

要解决此问题,请将变量设置为函数(each回调)的本地变量,以便成功回调在其范围内具有相应变量的闭包:

$('div[class=ceTable]').each(function () {
    var position = $(this).position(),
        gridID = $(this).attr('id'),
        tableID = $(this).attr("data-tableid"),
        docId = $(this).attr("data-docid"),
        headerFound = $(this).data("headerFound"),
        headerArray = $(this).data("headerArray"),
        columnCount = $(this).data("columnCount");
    …
于 2013-09-18T16:43:00.863 回答
2

使用闭包:

$('div[class=ceTable]').each(function () {
    var position = $(this).position();    
    gridID = $(this).attr('id')
    tableID = $(this).attr("data-tableid")
    docId = $(this).attr("data-docid")
    headerFound = $(this).data("headerFound")
    headerArray = $(this).data("headerArray")
    columnCount = $(this).data("columnCount")
    (function (columnCount, gridID, headerArray, headerFound) {    
        $.ajax().done();
    }(columnCount, gridID, headerArray, headerFound));
});
于 2013-09-18T16:34:07.740 回答