d3.js - 突出显示表格中的一行

Question

我试图在点击时突出显示d3中的一行。

var sampleHTML = d3.select("#TableContents")
            .append("table").attr("id", "TableContent")

            .style("border-collapse", "collapse")
            .style("border", "2px black solid")
            .attr("style", "margin-left: 20px")
            .attr("style", "margin-top: 30px")
            .attr("width", "750")
            .selectAll("tr").classed("th",true)
            .data(parsedCSV) 
            .enter().append("tr").attr("id",function(d,i){return "trtable" + i})
            .on("click" , function()
                        {
              d3.selectAll("tr").classed("highlight", false);
              d3.select("this").classed("highlight", true);           })
            .selectAll("td")
            .data(function(d,i){return d;}) 

这在FF和Chrome中运行良好，但在IE10中没有。好心提醒。

后来我做了修改以更新背景颜色：

function highlight(uRow)
{
    // initially set all the rows to white color
    var x = document.getElementById("TableContents").getElementsByTagName("tr");

    for(var i=1;i<x.length;i++){
        //alert(x[i].innerHTML);
        x[i].bgColor = "white";
    }
    //highlight the current row
    uRow.bgColor="#E1EAF1";

}

我也在点击事件中做了以下修改。

.on("click",function(){highlight(this)}) 

而不是

.on("click" , function()
             {
              d3.selectAll("tr").classed("highlight", false);
              d3.select(this).classed("highlight", true);

          })

然而它仍然无法在IE10中运行。有什么建议吗？