ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

บทที่ 5 jQuery Effect ตอนที่ 2 (callback funtion)
jQuery Callback Functions
   จากที่ได้เคยได้อธิบายเรื่อง Query Effect ไว้ใน  บทที่ 5 jQuery Effect ตอนที่ 1 แล้วในบทนี้เราจะมาพูดถึงฟังก์ชัน callback ของกันบ้าง
syntax ของ jQuery Effect
$(selector).hide(speed,callback);  ***speed(ความเร็ว)  อาจกำหนดเป็น slow, fast, normal หรือกำหนดเป็นมิลลิวินาทีก็ได้
       callback คือ function ที่ถูกเรียกใช้งานเมื่อ animated complete ใช้เมื่อเราต้องการให้ jQuery ทำคำสั่งแรกจนเสร็จก่อน แล้วจึงค่อยเริ่มทำคำสั่งที่สอง  
    syntax ของ jQuery Effect นั้นประกอบด้วย speed และ callback ซึ่งทั้งสองตัวนี้เป็นตัวเสริมที่มีมาเพิ่มเติมลูกเล่นของ Effect ให้หลากหลายมากขึ้น

1.ตัวอย่างการใช้งานฟังก์ชัน callback

<html>
<head>
<meta charset="utf-8">
<script src="/jquery-1.9.1.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide("10000",function(){
      alert("กำลังซ่อนข้อความ");
    });
  });
});
</script>
</head>
<body>
<button>ซ่อน</button>
<p>อยากเรียน jQuery อ่านใน www.mindphp.com ซิจ๊ะ</p>
</body>
</html>

คลิกดูตัวอย่าง callback

2.ตัวอย่างที่ไม่ใช้งานฟังก์ชัน callback

<html>
<head>
<meta charset="utf-8">
<script src="/jquery-1.9.1.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide(10000);
    alert("กำลังซ่อนข้อความ");
  });
});
</script>
</head>
<body>
<button>ซ่อน</button>
<p>อยากเรียน jQuery อ่านใน www.mindphp.com ซิจ๊ะ</p>
</body>
</html>

คลิกดูตัวอย่างแบบ without-callback

  ****จากตัวอย่างที่1 กับตัวอย่างที่2 จะสังเกตว่า มีที่ต่างกันคือตัวอย่างที่1 แบบมีฟังก์ชัน callback จะใช้เป็น   $("p").hide("10000",function(){  กับ ตัวอย่างที่2 แบบไม่มีฟังก์ชัน callback จะใช้เป็น  $("p").hide(10000); ซึ่งทั้งสองตัวอย่างให้ผลลัพธ์ที่แตกต่างกันคือ ตัวอย่างที่1 แบบมีฟังก์ชัน callback เมื่อคลิกที่ปุ่ม "ซ่อน" จะทำการซ่อนข้อความจนเสร็จแล้วจึงมีการ alert ต่างกับ ตัวอย่างที่2 แบบไม่มีฟังก์ชัน callback เมื่อคลิกปุ่ม "ซ่อน" จะทำการซ่อนข้อความแล้วตามด้วยการ alert ต่อมาติดๆ โดยไม่รอให้การซ่อนข้อความนั้นเสร็จก่อน ก็ alert ต่อในทันที

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
report ปัญหา ไม่มีแจ้งเตือนเวลามีคนตอบกระทู้ของเรา
โดย chatee supasand พ 13 พ.ย. 2019 1:05 pm บอร์ด MindPHP News / Feedback
2
44
อ 19 พ.ย. 2019 11:16 am โดย thatsawan
อยากทราบวิธีการจัดรูปแบบ css ให้เรียงอยู่ใน บรรทัดเดียวตลอด ทั้งตอนย่อ หรือ ตอนเต็มจอ
โดย Ittichai_chupol อ 19 พ.ย. 2019 10:53 am บอร์ด HTML CSS
0
12
อ 19 พ.ย. 2019 10:53 am โดย Ittichai_chupol
งานประจำวันที่ 19 พฤศจิกายน 2562
โดย numtan5839 อ 19 พ.ย. 2019 10:19 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
3
16
อ 19 พ.ย. 2019 7:17 pm โดย numtan5839
แสงสีน้ำเงิน (Blue light) มีอันตราย ส่งผลกระทบต่อดวงตา
โดย taemmynatchapon ส 14 ก.ค. 2018 6:48 pm บอร์ด Share Knowledge
2
434
อ 19 พ.ย. 2019 4:10 pm โดย Busba1122
การทำ Link-List เพื่อใช้ในการเข้าถึงข้อมูลต่างๆได้ง่ายยิ่งขึ้น
โดย rangsan ส 05 พฤษภาคม 2018 1:49 pm บอร์ด Share Knowledge
1
818
อ 19 พ.ย. 2019 10:11 am โดย LEG
Internet (อินเทอร์เน็ต), Intranet(อินทราเน็ต), Extranet(เอกซ์ทราเน็ต) เชื่องโยงกันอย่างไร
โดย Patcharanan.0399 พ 25 เม.ย. 2018 3:38 pm บอร์ด Share Knowledge
1
2881
อ 19 พ.ย. 2019 10:10 am โดย LEG
สอน Fix Password Teamviewer Password จะได้ไม่ต้อง random
โดย M003 ศ 14 ธ.ค. 2012 12:03 pm บอร์ด Share Knowledge
2
17823
อ 19 พ.ย. 2019 10:09 am โดย LEG
วิธีฝัง Font ใน PowerPoint
โดย khwanchanok อ 21 พฤษภาคม 2019 6:41 pm บอร์ด Share Knowledge
1
243
อ 19 พ.ย. 2019 10:07 am โดย LEG
คีย์บอร์ดพังฉุกเฉิน แก้ขัดด้วย On-Screen Keyboard
โดย teenproza7 พฤ 16 พฤษภาคม 2019 7:31 pm บอร์ด Share Knowledge
1
232
อ 19 พ.ย. 2019 10:06 am โดย LEG
แก้คอมอืดด้วย Disk Cleanup
โดย teenproza7 จ 13 พฤษภาคม 2019 5:55 pm บอร์ด Share Knowledge
1
217
อ 19 พ.ย. 2019 10:06 am โดย LEG
สิ่งที่ต้องทำ ก่อนโทรศัพท์หายหรือโดนขโมย
โดย birdkritsna อ 17 ก.ย. 2019 3:23 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
118
อ 19 พ.ย. 2019 9:59 am โดย LEG
ข้อมูลที่ทำการ loop ไม่เข้าไปเก็บใน array ครับ
โดย bankjittapol จ 18 พ.ย. 2019 8:16 pm บอร์ด Joomla Development
2
20
อ 19 พ.ย. 2019 4:23 pm โดย bankjittapol
ใช้คำสั่ง วันที่ยังไง โดยไม่ต้องกำหนด timezone
โดย bankjittapol จ 18 พ.ย. 2019 8:11 pm บอร์ด Joomla Development
2
20
พ 20 พ.ย. 2019 6:23 pm โดย bankjittapol
จะกำหนดเงื่อนไขภาษายังไง โดยไม่ไปกำหนดค่าภาษาตรงๆ
โดย bankjittapol จ 18 พ.ย. 2019 8:01 pm บอร์ด Joomla Development
1
13
จ 18 พ.ย. 2019 8:08 pm โดย tsukasaz
ศึกษาการใช้งาน Joomla
โดย numtan5839 จ 18 พ.ย. 2019 7:16 pm บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
0
3
จ 18 พ.ย. 2019 7:16 pm โดย numtan5839
ผลพยากรณ์อากาศ เปลี่ยนภาษาตามการตั้งค่าของผู้ดูแลระบบ
โดย bankjittapol จ 18 พ.ย. 2019 7:11 pm บอร์ด Joomla Developing Knowledge
1
23
อ 19 พ.ย. 2019 1:36 pm โดย mindphp
สร้าง list box ใน joomla ที่สามารถเลือก มากกว่า 1 ค่า
โดย bankjittapol จ 18 พ.ย. 2019 6:14 pm บอร์ด Joomla Developing Knowledge
0
26
จ 18 พ.ย. 2019 6:14 pm โดย bankjittapol
จะดึงชื่อจังหวัดมาแสดงใน list ได้ยังไงครับ
โดย bankjittapol จ 18 พ.ย. 2019 5:45 pm บอร์ด Joomla Development
1
21
จ 18 พ.ย. 2019 5:52 pm โดย tsukasaz
ต้องการให้ ใน list แสดงชื่อจังหวัด เพื่อใช้เลือกแสดงครับ
โดย bankjittapol จ 18 พ.ย. 2019 12:03 pm บอร์ด Joomla Development
2
32
จ 18 พ.ย. 2019 4:02 pm โดย bankjittapol
Work's on Hand ตรีเนตร บูรณโพธิ์ทอง M097
โดย numtan5839 จ 04 พ.ย. 2019 11:09 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
2
26
จ 18 พ.ย. 2019 3:27 pm โดย numtan5839