อยากรู้ว่า Iframe ทำการโหลดเสร็จแล้วรึยัง?

เอาล่ะครับ ช่วงนี้อากาศหนาวเริ่มมาเยือน สลับกับฝนตกเล็กน้อย ก็เลยนึกอยากมาอัพเดทบล๊อกบ้าง (เกี่ยวกันมั้ยเนี่ย) วันนี้มี Tip เล็กๆน้อยสำหรับ ทำการเช็ค Status ของ Iframe ว่าทำการโหลดเสร็จแล้วรึยัง….

อ้าวแล้วทำไมเราต้องอยากรู้?

หลายคนอาจมีคำถามในใจ 555 สำหรับตัวผมเองมันมีประโยชน์แบบนี้ครับ เช่นเวลาที่ผมสั่ง iframe มัน hide เอาไว้ ด้วย display:none ซึ่งแน่นอน มันก็ยังทำการโหลดเป็น background process อยู่ดี แล้วทีนี้ถ้าอยากบอกว่าเมื่อโหลดเสร็จให้มันแสดงล่ะจะทำไงดี?

นี่ล่ะครับประโยชน์ของ Tip! ที่จะมาแนะนกันในวันนี้ ซึ่งวิธีการเขียน โครตจะแสนง่ายจนไม่รู้จะบรรยายยังไงแล้ว แค่ 2-3 บรรทัดก็รู้เรื่อง ตัวอย่างเช่น ผมมี iframe แบบนี้

  1. <iframe src="http://www.jQueryTips.com" id="myiframe"></iframe>

ผมจะเขียนเช็คดูว่ามัน load ไปเสร็จยังก็จะเขียนว่า….

  1. $(function() {
  2.   $(‘#myiframe’).load(function() {
  3.     alert(‘iframe โหลดเรียบร้อยแล้วคร๊าบบบบบ’);
  4.   });
  5. });

และนอกจากจะเอาวิธีนี้ไปใช้กับ iframe แล้ว ยังเอามาประยุกต์ใช้กับการ load image ได้ด้วย โดยรูปแบบก็ไม่ได้จะต่างกันเลยล่ะ

  1. <img src="http://…..jpg" id="mypicture" />
  1. $(function() {
  2.   $(‘#mypicture’).load(function() {
  3.     alert(‘image โหลดเรียบร้อยแล้วคร๊าบบบบบ’);
  4.   });
  5. });

เอาล่ะครับ ก่อนจะจากกันไปวันนี้ ผมมีเพลงที่ตอนนี้กำลังชอบมากมาฝากกัน (อย่าไปฟ้องค่ายเค้าล่ะ) ไปฟังกันแล้วก็นอนหลับฝันดีนะ

Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

3 Comments »

 
 

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>