Jquery - 向表中添加新行（IE 友好版本）

Posted 2023-03-05

【中文标题】Jquery - 向表中添加新行（IE 友好版本）

【英文标题】：Jquery - Add new row to table (IE friendly version)

【发布时间】：2014-07-03 13:13:29

【问题描述】：

我在使用 JQuery 和 Internet Explorer (IE) 时遇到问题。我添加行的方法似乎在 IE 中不起作用（Chrome 和 Firefox 没有问题）

想象一下下表

<table border="1">
    <tr>
        <td><button class="btn">btn1a</button></td>
        <td><button class="btn">btn1b</button></td>
        <td>zever</td>
        <td>zeverin pakskes</td>
    </tr>
    <tr>
        <td><button class="btn">btn2a</button></td>
        <td><button class="btn">btn2b</button></td>
        <td>zever</td>
        <td>zeverin pakskes</td>
    </tr>
    </table>

要添加行（当用户单击“按钮”时）我执行以下方法

$(document).ready(function()
    $('.btn').on('click',function()
        var parentrow = $(this).parent().parent();
        parentrow.after('<tr ><td colspan="4">Dit is een colspan rij</td></tr>');
    );
);

问题：我怎样才能改变我的方法，使它也能在 IE 中工作？ （例如，正在添加该行）？

注意：我正在使用以下 JQuery - 库

<script src="https://code.jquery.com/jquery.js"></script>

【问题讨论】：

嘿，这是一个错字

@user3127499 一个错字的详细问题比一个糟糕的问题好！

@nietonfir 是的，但我的经历教会了我其他方面的智慧

【参考方案1】：

删除开头<tr> 标记中的traling 空格，IE 不喜欢无效的html（不是开玩笑！！）。 ;-)

parentrow.after('<tr><td colspan="4">Dit is een colspan rij</td></tr>');

【讨论】：

天哪！我想我会用头撞墙一段时间:)。您的解决方案是正确的。我不知道 IE 可以在愚蠢的间距上表现得如此困难。

【参考方案2】：

几个月前我也遇到了同样的问题并遵循以下方法

将元素创建为单独的元素：

parent.after($('<tr/>').append($('<td colspan="4" />').text('Dit is een colspan rij')));

【讨论】：

那里的代码不错！ :) 问题：除了插入纯文本之外，我还可以插入 Html（使用 .text()）吗？

这在较旧的 IE 版本 iirc 中不起作用。具有讽刺意味的是，IE 在创建过程中不喜欢自闭合元素。

哦，太好了！我只知道测试的功能！