Add new row to table (IE friendly version)

Im' having problems with JQuery and Internet Explore (IE). My method for adding rows doesn't seem to be working in IE (Chrome & Firefox pose no problem)

Imagine following table

<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>

To Add rows (when the user clicks a 'button') i perform the following method

$(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>');
    });
});

Question: How can i alter my method so it works in IE too? (eg the row is being added)?

Note: i'm using the following JQuery - library

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

---

Remove the traling space in your opening <tr> tag, IE doesn't like invalid HTML (no joke!!). ;-)

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

---

I also came across the same problem few months back and followed the below approach

Create the elements as separate elements instead:

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

链接地址: http://www.djcxy.com/p/79132.html

上一篇: y的StatusBar记录x

下一篇: 向表格添加新行（IE友好版本）