คำสั่งนี้จะำทำงานตรงกันข้ามกับคำสั่ง before()
after(content)
content : (string|selector)
คำสั่งนี้จะทำหน้าที่เพิ่ม content เข้าไปต่อท้าย selector ที่เรียกใช้ฟังก์ชั่น โดยแบ่งเป็น สองกรณี คือ ถ้าส่ง string เข้าไปในฟังก์ชั่น จะเป็นการนำ string นั้นไปต่อท้าย selector ที่เรียกใช้ฟังก์ชั่น กรณีที่ 2 ถ้าส่ง selector เข้าไปในฟังก์ชั่น จะเป็นการย้าย selector ตัวนั้นไปต่อท้าย selector ที่เรียกใช้ฟังก์ชั่น
ตัวอย่างการใช้งาน
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <title>jquery after command</title> <script type="text/javascript"> $(document).ready(function(){ $('#after_selector').click(function(){ $('h1').after( $('h2') ); }); $('#after_string').click(function(){ $('h1').after( 'ข้อความที่เพิ่มเข้าไปใหม่' ); }); }) </script> </head> <body> <h2 class="head">| เนื้อหาของ h2 |</h2> <p> <input type="submit" name="after_selector" id="after_selector" value="After (selector)" /> <input type="submit" name="after_string" id="after_string" value="After (string)" /> </p> <h1>| เนื้อหาของ h1 |</h1> </body> </html> |
ในตัวอย่างผมแสดงให้เห็น การส่งพารามิเตอร์เข้าไปในฟังก์ชั่น ทั้งกรณีที่เป็น string และกรณีที่เป็น selector
Leave a Reply