Question

我对动态tr有疑问，并保留td。

的内容

我有一张像流动代码一样的表：

<table id="map2">
    <tr>
        <td class="15c">15</td>
        <td class="16c">16</td>
        <td class="17c">17</td>
    </tr>
    <tr>
        <td class="15c">15</td>
        <td class="16c">16</td>
        <td class="17c">17</td>
    </tr>
</table>

我添加了一些动态创建列的jQuery代码。喜欢流动的代码：

$('#map2').on('mouseenter', 'td:last-child', function(){
            var tdClass = $(this).attr('class');
            var newClass = parseInt(tdClass);
            if(newClass <= 30) {
                $(this).after('<td class="'+ (newClass+1) +'c">'+ (newClass+1) +'</td><td class="'+ (newClass+2) +'c">'+ (newClass+2) +'</td><td class="'+ (newClass+3) +'c">'+ (newClass+3) +'</td>');
            } else {
                alert('end!')
            }
        });

        $('#map2').on('mouseenter', 'td:first-child', function(){
            var tdClass = $(this).attr('class');
            var newClass = parseInt(tdClass);
            if(newClass >= 3) {
                $(this).before('<td class="'+ (newClass-3) +'c">'+ (newClass-3) +'</td><td class="'+ (newClass-2) +'c">'+ (newClass-2) +'</td><td class="'+ (newClass-1) +'c">'+ (newClass-1) +'</td>');
            } else {
                alert('end!')
            }
        });

该代码为我创建了td，现在我想创建一个tr（行）来保留内容。例如，在创建新行时，其内容与td之前tr之前的内容相同。我试过这样的代码：

$('#map2').on('mouseenter', 'tr:first-child', function(){
            var trCont = $(this).html;
            // $(this).before('<tr>'+ trCont +'</tr>');
            $(this).before('<tr><td>new row</td></tr>');
        });

但没有奏效。我该如何解决这个问题？

http://jsfiddle.net/H6MSS/2/

如何将tr（行）与动态td（列）一起添加到表中？

0 个答案: