Question

我正在尝试显示一个包含100行的表，我想显示前20行并首先隐藏其他行。然后在此之后的20行中直到我们到达100行并刷新页面...我我正在使用setTimeout函数来延迟隐藏和显示特定行的过程，但是如果我使用setTimeout的时间为26000秒，它将无法响应

PHP

<?php 
$sql = "SELECT *, ROW_NUMBER() OVER(ORDER BY jloc_title ASC) AS Rownum,jloc_id, jloc_title 
FROM Locations";
$stmt = sqlsrv_query($connection,$sql);
if($stmt == false)
{
echo"Error (sqlsrv_query):".print_r(sqlsrv_errors(),true);
exit;
}
while($row1=sqlsrv_fetch_array($stmt))
{
$id = $row1[0];
$title = $row1[1];
$Rownumber = $row1[2];              
echo"<tr id='Row' value='".$Rownumber."'    >";
echo"<td class='text-center'> " .$Rownumber.  "</td>";
echo"<td class='text-center'> " .$id. "</td>";
echo"<td class='text-center'> " .$title. "</td>";
echo"</tr>";
}
?>

jQuery

$(document).ready(function(){
var number = document.getElementById("table1").rows.length ; 
alert (number); 
    $(function(){
        $("#table1 tr").each(function(){
            var val = $("td:eq(0)", this).html();
            if(val > 2)
            {
                $(this).hide(); 

                        setTimeout(function(){  
                        $("#table1 tr").each(function(){
                        var val1 = $("td:eq(0)",this).html();
                        if(val1 <= 2)
                        {$(this).hide();    }
                        });
                        },13000);


                        setTimeout(function(){          
                            $("#table1 tr").each(function(){
                            var val2 = $("td:eq(0)",this).html();
                            if( 2< val2 && val2 <= 4)
                            {
                                $(this).show();

                            }
                            else
                            {
                                setTimeout(function(){location.reload();}, 13001);
                            }
                        });
                        },13001);

                if(number > 4 )
                {

                        setTimeout(function(){  
                            $("#table1 tr").each(function(){
                            var val3 = $("td:eq(0)",this).html();
                                if( val3 <= 4)
                                {
                                $(this).hide();
                                }
                            });
                        },20000);
                                    setTimeout(function(){          
                                    $("#table1 tr").each(function(){
                                    var val4 = $("td:eq(0)",this).html();
                                        if( val4 > 4 && val4 <= 6  )
                                        {
                                            $(this).show();
                                        }
                                        else
                                        {
                                            setTimeout(function(){location.reload();},20001);
                                        }
                                    });
                                    },20001);

                                if(number >6 )
                                {
                                    setTimeout(function(){   
                                    $("#table1 tr").each(function(){
                                    var val5 = $("td:eq(0)",this).html();
                                    if( val5 <= 6 )
                                    {
                                        $(this).hide();
                                    }
                                    });
                                    },26000);


                                    setTimeout(function(){   
                                        $("#table1 tr").each(function(){
                                        var val6 = $("td:eq(0)",this).html();
                                        if ( val6 > 6 && val6 <= 8 )
                                        {
                                            $(this).show();


                                        }
                                        else
                                        {
                                            setTimeout(function(){location.reload();},26001);
                                        }

                                        });
                                    },26001);

                                }
                                else
                                {
                                    setTimeout(function(){location.reload();},25003); 
                                }

                }
                else
                {
                    setTimeout(function(){location.reload();},25000); 
                }
            }
            else
            {
                setTimeout(function(){location.reload();},20003); 
            }
        });
    });

}）；

Answer 1

简介

我在理解您的脚本时遇到了一些困难。我想做一个不同的脚本来做同样的事情。

下面的脚本隐藏了所有行。

然后每秒进行一次，使20个新行出现。

最终版本中的一个解决方法是避免使用全局参数。（正在处理）

示例脚本：https://jsfiddle.net/qs193r20/1/

<script>
var i= 0;
var limit = 100;
var a = function(){

                                    var list = $("#table1 tr");
                                    i=i+20;
                                    alert(i);

                                    $("#table1 tr").each(function(){
                                        var val = $("td:eq(0)", this).html();   
                                        if(val < i){
                                             $(this).show();
                                        }
                                    }); 

                                    if(i < limit){
                                        setTimeout(a, 1000);
                                    }


                                 };


$(document).ready(function(){
    alert("Test1");

var number = document.getElementById("table1").rows.length ; 
alert (number); 
    $(function(){

        //Hide All
        $("#table1 tr").each(function(){
                var val = $("td:eq(0)", this).html();   
                $(this).hide();             
        }); 





         setTimeout(a, 1000);



        }); 

});     

</script>

延迟显示和隐藏表中的行

1 个答案:

简介