ฉันจะกำหนด scrollHeight ได้อย่างไร


96

ฉันจะกำหนด scrollHeight ของการหารได้อย่างไรโดยใช้ css overflow: auto

ฉันได้ลองแล้ว:

$('test').scrollHeight();
$('test').height(); but that just returns the size of the div not all the content

ท้ายที่สุดฉันพยายามสร้างการแชทและมีแถบเลื่อนไปยังข้อความปัจจุบันบนหน้าจอเสมอ

ดังนั้นฉันจึงคิดบางอย่างดังนี้:

var test = $('test').height();
$('test').scrollTop(test);

ขอบคุณ,

ไบรอัน


เกิดอะไรขึ้นกับการใช้ scrollHeight ()?
Badr Hari

2
@BadrHari: ไม่มีscrollHeight()ฟังก์ชันใน jQuery
TJ Crowder

มันคือ $ ('test') รับ (0) .scrollHeight ();
JFouad

คำตอบ:


91

scrollHeight เป็นคุณสมบัติจาวาสคริปต์ทั่วไปดังนั้นคุณไม่จำเป็นต้องใช้ jQuery

var test = document.getElementById("foo").scrollHeight;

ขอบคุณ! สิ่งนี้ใช้ได้ผลสำหรับฉัน: var height = document.getElementById ("chatLog") scrollHeight - $ ('# chatLog'). height (); $ ('# chatLog'). scrollTop (ความสูง);
Brian

6
สิ่งที่รองรับเบราว์เซอร์? เบราว์เซอร์เวอร์ชันหลักทั้งหมดรองรับหรือไม่ IE8 +?
SexyBeast

2
@Cupidvogel หน้า MDN ที่เชื่อมโยงกล่าวว่า IE8 +
Dennis

320

วิธีที่ถูกต้องใน jQuery คือ -

  • $('#test').prop('scrollHeight') หรือ
  • $('#test')[0].scrollHeight หรือ
  • $('#test').get(0).scrollHeight

16
+1 สำหรับ $ ('# test') [0] .scrollHeight เนื่องจากผู้ถามใช้ jQuery อยู่แล้ว
Jackson

12
นี่ควรเป็นคำตอบที่ได้รับการยอมรับเนื่องจากตอบคำถาม
ใบแจ้งหนี้

ควรเป็นคำตอบที่ได้รับการยอมรับ สังเกตว่าpropเมธอดต้องใช้ jquery เวอร์ชัน 1.6 หรือใหญ่กว่า +1 จากฉัน
Vayne

2
โปรดทราบว่าสิ่งนี้จะส่งคืนเฉพาะ scrollHeight ขององค์ประกอบ "แรก" ที่พบและหากองค์ประกอบใด ๆ "ซ่อนอยู่" ในขณะนี้คุณอาจได้รับศูนย์ที่นี่แม้ว่าคนอื่นจะมี scrollHeight เป็นบวก FWIW :)
rogerdpack

@rogerdpack ดีครับท่าน! แม้ว่าในตัวอย่างนี้เขาจะใช้ ID แทนคลาสเป็นตัวเลือกดังนั้นเขาควรจะโอเค แต่ถึงกระนั้นก็ยังมีจุดที่ดี
dave4jr
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.