Question

我在.aspx页面中有一个Gridview，它从另一个被调用的页面获取行。此其他页面返回单个表行（tr）作为SQL查询的结果。这种情况每秒都会发生。

新行将添加到表格/ gridview的顶部。

我需要将行数限制为一个数字，例如10.我的代码到目前为止（主要通过Stackoverflow中的示例找到）运行良好，除非表格达到10行，它将闪烁第9个第10行。即它将显示9行，然后是10行，然后是9行，依此类推。

理想情况下，它会添加最多10行，然后添加新行，第10行或最后一行丢弃而不会出现任何闪烁。它会更具“流动性”。好像在滚动一样。

我发现所有示例都是因为点击按钮而删除了行。我需要将table / gridview增长到10，然后在添加新行时，最后一行会下降。

我希望这是有道理的。

有关如何改善这一点的任何建议？谢谢。

<script type="text/javascript" >
  var jq = jQuery.noConflict();
  f1();
  function f1() {  // gridView updated every 1000ms
    jq(document).ready(function () {
      var lastid = jq.cookie("maxid");  // set by pageInit
      if (lastid != "0")
        jq.get("page2.aspx", function (dataReturned) {
          if (dataReturned != "")    // rows in database - add to the gridView 
          {
            // add new row
            jq('#<%=GridView1.ClientID %> tr:first').after(dataReturned);
            // hide the new row, then fade it back in ----  tr:eq(0) is the header row.

            jq('#<%=GridView1.ClientID %> tr:eq(1)').hide().fadeIn(1000, function () { 
                  // nop
                }).css('display', 'table-row');
          }
          window.setTimeout("f1()", 1000);
        });
      else
        jq.get("page2.aspx", function (dataReturned) {
          if (dataReturned != "")     //new rows in database 
          {
            jq('#<%=GridView1.ClientID %>').html(dataReturned);
          }
          window.setTimeout("f1()", 1000);
        });
    });
       LimitRows();
    }

  function LimitRows(){
    while (jq('#<%=GridView1.ClientID %> tr').length > '10')
     {
       jq('#<%=GridView1.ClientID%> tr:last').remove();
    }      }    
</script>

jquery添加表行，删除表行。最多10行

0 个答案: