Jquery ตัวอย่าง การจับตำแหน่ง scrollTop เพื่อ Load Data เพิ่มเมื่อเลื่อนจนถึงล่างสุด
ตัวอย่าง Script เพื่อหาตำแหน่งของ scrollTop โดยใช้ jquery
var $height = $(window).scrollTop();
คำสั่งนี้จะได้ ตำแหน่งของ scrollTop ออกมาเป็นตัวเลข
หลังจากนั้นเราก็ใช้ $height ไปใช้ต่อ
ยกตัวอย่างถ้าเราต้องการ ตรวจสอบว่าเลื่อน Scroll ถึงตำแหน่งล่างสุดของ หน้าจอหรือยัง
เราจำเป็นต้องรู้ ค่าของตัวแปรต่างๆ ดังนี้
1. $(window).scrollTop() ตำแหน่งของ Scroll ด้านบน แทนค่าว่า A
2. $(window).height() ความสูงของหน้าจออันนี้จะคงที่เสมอ ตามขนาดของ Browser ต่อไปจะเรียกว่า B
3. $(document).height() ความสูงของ เอกสารทั้งหมดรวมส่วนที่เรายังไม่ได้ scroll ลงไปเด้วย ต่อไปจะเรียกว่า C
ถ้า A+B = C เมื่อไร นั่นคือตำแหน่งล่างสุดของหน้าจอ
เราสามารถเขียน code ได้ง่ายๆ ตามตัวอย่าง
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() == $(document).height()) {
alert("ล่างสุดแล้วนะ");
// เรียกใช้ function ในการ ดึงข้อมูลเพิ่มได้เลย
}
});
ลองนำไปใช้กันดูนะครับ
SQL Command select ข้อมูลที่มี รหัสซ้ำกัน หรือ ID ซ้ำกัน 