Question

我正在使用D3.js根据从Firefox中的AJAX调用中检索到的数据动态更新HTML表。在我之前拥有数据后，我的数组可能实际上是空的（因此，首先使用array = [{...}，{...}，{...}，...]调用此代码然后用array = []调用，我使用Firebug验证变量数组实际上确实有这些值）。当它第二次被调用时，我希望空数组会导致代码删除当前表中的所有行，但这不会发生。相反，旧数据仍显示在表格中。有人可以解释为什么这段代码不正确（或者至少是一种正确的方法来做我想要的）？

var rows = d3.select(TABLE_BODY_ID)
    .selectAll("tr")
    .data(array, function(d) {
        return d.id;
    });
rows.enter()
    .append("tr")
    .selectAll("td")
    .data(function() { ... })
    .enter()
    .append("td")
    .each(function(d, i)
    {
        if(3 === i)
        {
            var img = d3.select(this)
                .append("img");
            img.attr("src", d)
                .attr("width", 20)
                .attr("height", 20);
        }
        else d3.select(this).text(function(d) { return d; });
    });
rows.exit().remove();

我在其他表上使用与此基本相同的代码，并且它没有任何问题，所以我不知道为什么它对这一个表不起作用。

谢谢！

编辑以获取更多信息：

在探索了一些之后，我发现代码确实实际上有效。行仍然出现在表中的原因显然是由于其后面的行：

$(TABLE_ID).trigger("sorton", [[[1, 1],[2, 1]]]);

显然，tablesorter插件与D3.js不兼容。我仍然不确定如何解决这个问题，但我有一些想法。

删除D3中的HTML表行

0 个答案: