上一篇是在頁面中分割出一張div並且使用捲軸效果
本篇是直接把整個頁面當捲軸，程式碼更為簡單
如果要嵌入到某個網頁中，用iframe或div即可
程式碼如下
======================Javascript======================
<script>
$(function()
{
start = 0; //起始資料
range = 50; //一次撈出多少筆資料
$(window).scroll(function()
{
$BodyHeight = $(document).height();
//判斷所見範圍的高度
$ViewportHeight = $(window).height();
//偵測目前捲軸頂點
$ScrollTop=$(this).scrollTop();
if($BodyHeight == ($ViewportHeight+$ScrollTop))
{
var end = start + range;
$.ajax({
type: "GET",
url: "data.php",
data: "start=" + start + "&end=" + end,
success: function(data)
{
$("table tr:last").after(data); //表格插入新資料
}
});
start = end + 1;
}
});
});
</script>
======================Javascript======================
<body>
<table name='table' border='1' width='800'>
<tr><td>ID</td><td>公司名稱</td><td>網址</td><td>住址</td><td>電話</td></td>
<div id='data'><?php echo initdata(); ?></div>
</table>
</body>
本篇是直接把整個頁面當捲軸，程式碼更為簡單
如果要嵌入到某個網頁中，用iframe或div即可
程式碼如下
======================Javascript======================
<script>
$(function()
{
start = 0; //起始資料
range = 50; //一次撈出多少筆資料
$(window).scroll(function()
{
$BodyHeight = $(document).height();
//判斷所見範圍的高度
$ViewportHeight = $(window).height();
//偵測目前捲軸頂點
$ScrollTop=$(this).scrollTop();
if($BodyHeight == ($ViewportHeight+$ScrollTop))
{
var end = start + range;
$.ajax({
type: "GET",
url: "data.php",
data: "start=" + start + "&end=" + end,
success: function(data)
{
$("table tr:last").after(data); //表格插入新資料
}
});
start = end + 1;
}
});
});
</script>
======================Javascript======================
<body>
<table name='table' border='1' width='800'>
<tr><td>ID</td><td>公司名稱</td><td>網址</td><td>住址</td><td>電話</td></td>
<div id='data'><?php echo initdata(); ?></div>
</table>
</body>