jquery ค้นหาองค์ประกอบถัดไปตามคลาส


103

ฉันจะค้นหาองค์ประกอบถัดไปตามชั้นเรียนได้อย่างไร

ฉันพยายามมี$(obj).next('.class');แต่ผลตอบแทนที่ได้เรียนเฉพาะใน$(obj)ผู้ปกครอง ฉันต้องการนำองค์ประกอบถัดไปที่ใดก็ได้ตลอดรหัสตามชื่อคลาส เพราะรหัสของฉันดูเหมือน

<table>
<tr><td><div class="class">First</div></td></tr>
<tr><td><div class="class">Second</div></td></tr>
</table>

เป็นไปได้หรือไม่

คำตอบ:


149

ในกรณีนี้คุณต้องขึ้นไปใช้<tr> แล้ว.next()เช่นนี้:

$(obj).closest('tr').next().find('.class');

หรือหากอาจมีแถวอยู่ระหว่างกลางโดยไม่มี.classด้านในคุณสามารถใช้.nextAll()ดังนี้:

$(obj).closest('tr').nextAll(':has(.class):first').find('.class');

มันจะง่ายกว่าที่จะทำสิ่งนี้: $ (obj) .closest ('tr'). nextAll ('. class') [0];
StuR

2
@StuR - นั่นจะใช้ไม่ได้ที่นี่เนื่องจาก. nextAll () ดูเฉพาะองค์ประกอบพี่น้องเท่านั้น คุณต้องการสิ่งที่ดูลูกหลานเพื่อค้นหา <div> คำถามต่อไปที่ต้องการ
Nick Craver

1
แล้วถ้าอยากได้แอตทริบิวต์จาก HTMLObject นั้นคืนล่ะ? Like an$(obj).closest('tr').nextAll('.class')[0].attr('data-attribute');
Dennis Braga

คุณอาจต้องใช้: .parent (). next ("")หากองค์ประกอบไม่มีพี่น้อง
shasi kanth

@NickCraver คุณยอดเยี่ยมมาก
วิญญาณศักดิ์สิทธิ์

23

หากต้องการค้นหาองค์ประกอบถัดไปที่มีคลาสเดียวกัน:

$(".class").eq( $(".class").index( $(element) ) + 1 )

14

คุณไม่สามารถใช้ next () ในสถานการณ์นี้ได้หากคุณดูเอกสารที่ระบุว่า:
Next () รับ พี่น้องต่อไปนี้ทันทีของแต่ละองค์ประกอบ ในชุดขององค์ประกอบที่ตรงกัน หากมีการระบุตัวเลือกระบบจะดึงข้อมูลพี่น้องถัดไปที่ตรงกับตัวเลือก

ดังนั้นหาก DIV ตัวที่สองอยู่ใน TD เดียวกันคุณสามารถโค้ด:


// Won't work in your case
$(obj).next().filter('.class');

แต่เนื่องจากไม่ใช่ฉันจึงไม่เห็นจุดที่จะใช้ next () คุณสามารถใช้รหัสแทน:

$(obj).parents('table').find('.class')


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