0

我有一个表，在数据绑定发生后我需要更改它。在我们在 IE8 上进行测试之前，我做得很好。在那个浏览器上，它失败了。本质上，第 3 方控件将呈现为 2 个表格。第一个表包含网格的标题（包括排序/过滤/分组选项），第二个表包含数据本身。我需要“更改”标题，添加“主标题”行，在 TD 元素和 A 元素上使用我们自己的一些类来扩充类。整个 jQuery 函数如下所示：

function onDataBound(e) {
    var grid = $(this).data("tGrid");
    if ($(this)[0].id.indexOf("open") != -1)
        grid = $("#open tbody")[0];
    else
        grid = $("#closed tbody")[0];

    var tb1 = $(grid).html();

    if (tb1.indexOf("<tr><td") == -1 && tb1.indexOf("<TR><TD") == -1 && tb1.indexOf("<TR>\r\n<TD") == -1) {
        // Lower case
        tb1 = tb1.replace(/<th class=/g, "<td class=");
        tb1 = tb1.replace(/th>/g, "td>");

        // Upper case
        tb1 = tb1.replace(/<TH class=/g, "<td class=");
        tb1 = tb1.replace(/TH>/g, "td>");

        $("td.t-header").each(function() {
            var text = $(this).html();
            text = text.replace("t-header", "t-header rr-header rr-header-text");
            $(this).html(text);
        });
        $("a.t-link").each(function () {
            var text = $(this).html();
            text = text.replace("t-link", "t-link rr-link");
            $(this).html(text);
        });

        //tb1 = tb1.replace(/t-header/g, "t-header rr-header rr-header-text");
        //tb1 = tb1.replace(/t-link/g, "t-link rr-link");

        tb1 = tb1.replace("Project ID", "Project<br/>ID");
        tb1 = tb1.replace("Risk ID", "Risk<br/>ID");
        tb1 = tb1.replace("Managing Department", "Managing<br/>Department");
        tb1 = tb1.replace("Cost Impact", "Cost<br/>Impact");
        tb1 = tb1.replace("Schedule Impact", "Schedule<br/>Impact");
        tb1 = tb1.replace("Probability of Occurance", "Probability<br/>of<br/>Occurance");
        tb1 = tb1.replace("Responsible Party", "Responsible<br/>Party");
        tb1 = tb1.replace("Due Date", "Due<br/>Date");
        tb1 = tb1.replace("Cost Severity", "Cost<br/>Severity");
        tb1 = tb1.replace("Schedule Severity", "Schedule<br/>Severity");

        tb1 = "<tr><td colspan='7' class='rr-header rr-risk-identification'>RISK IDENTIFICATION</td>" +
            "<td colspan='3' class='rr-header rr-risk-assessment'>RISK ASSESSMENT</td>" +
            "<td colspan='2' class='rr-header rr-risk-mitigation'>RISK MITIGATION</td>" +
            "<td colspan='2' class='rr-header rr-severity-index'>SEVERITY INDEX</td></tr>" +
            tb1;

        $(grid).html(tb1);
    }
}

我试图让以下代码（片段）在IE8上运行时工作。到目前为止，我没有运气。这是我的原始代码（上面的片段），它在 IE9 及更高版本、Chrome、FireFox 等中运行良好 - 但在 IE8 中不起作用：

tb1 = tb1.replace(/t-header/g, "t-header rr-header rr-header-text");
tb1 = tb1.replace(/t-link/g, "t-link rr-link");

我也尝试过这样做（也来自上面的片段）：

$("td.t-header").each(function() {
    var text = $(this).html();
    text = text.replace("t-header", "t-header rr-header rr-header-text");
    $(this).html(text);
});
$("a.t-link").each(function () {
    var text = $(this).html();
    text = text.replace("t-link", "t-link rr-link");
    $(this).html(text);
});

我使用正则表达式替换得到的结果如下： 在此处输入图像描述

正如你所看到的，第一个 TD 被正确替换了，但是其余的都做了一些奇怪的事情！使用 EACH 循环完全失败。

有任何想法吗？

4

1 回答 1

1

如果您只是想修改类列表，是否可以直接从每个循环内部设置类名？

$("td.t-header").each(function() {
    this.className = "t-header rr-header rr-header-text";
});

此处列出了使用 Jqueries 切换类的另一种解决方案：

https://stackoverflow.com/a/2576780/2511885

于 2013-07-23T22:48:39.773 回答