如何在附加到表时将fadeIn()用于单行

时间:2015-12-09 04:08:05

标签: jquery ajax web

我的目标是在表格的一行附加一个表格时调用fadeIn()函数。

我遇到以下代码问题。它淡出整个桌子。

$.get("/getItems/"+count, function(data){
            tr="<tr> <div>";
            td1="<td>"+data["ID"]+"</td>";
            td2="<td>"+data["UNITID"]+"</td>";
            td3="<td>"+data["INSTNM"]+"</td>";
            td4="<td>"+data["ADDR"]+"</td>";
            td5="<td>"+data["CITY"]+"</td>";
            td6="<td>"+data["STABBR"]+"</td>";
            td7="<td>"+data["ZIP"]+"</td><div></tr>";
            $("#table1").append(tr+td1+td2+td3+td4+td5+td6+td7);


           (tr.find(div)).fadeIn(300);

            var rowCount = $('#table1 tr').length;  
            console.log(rowCount);

            if(rowCount>20)
            {
                removeFirstRowAndAppendNewItem(data)
            }
            function removeFirstRowAndAppendNewItem(data)
            {
              console.log("in callback"); // to confirm we have reached here
              $("table#table1 tr:nth-child(2)").remove();}});

知道为什么整个表格会更新而不是一行吗?

1 个答案:

答案 0 :(得分:0)

淡出表格中的第一行

$('table#table1 > tr:first').hide().fadeIn(300);

$('table#table1 > tr').first().hide().fadeIn(300);

关于你的代码,你可以像这样做

        tr ="<tr> <div>";
        tr +="<td>"+data["ID"]+"</td>";
        tr +="<td>"+data["UNITID"]+"</td>";
        tr +="<td>"+data["INSTNM"]+"</td>";
        tr +="<td>"+data["ADDR"]+"</td>";
        tr +="<td>"+data["CITY"]+"</td>";
        tr +="<td>"+data["STABBR"]+"</td>";
        tr +="<td>"+data["ZIP"]+"</td><div></tr>";
        $("#table1").append(tr);