jQuery กำหนดให้รอ response จาก AJAX ด้วย option async
เคยเป็นมั๊ยครับเวลาเขียน javascript
แล้วมีการ call ajax เอาค่ามา set ใส่ตัวแปรตอนจบ
แล้วมีผลว่ามันจบด้วยการที่ ตัวแปรนั้นไม่มีค่าอะไรเลย ทั้งๆ ที่การ call ajax นั้น success
นั่นเป็นเพราะว่า jquery ajax ทำงานแบบ async คือไม่รอ response ที่ตอบกลับมานั่นเอง
แนวทางแก้ง่ายๆ โดยการใส่ option async = false เข้าไปตามตัวอย่าง
เพียงเท่านี้โปรแกรมเราก็จะรอให้การ call ajax เสร็จเรียบร้อยก่อนค่อยข้ามไปทำงาน step ถัดไป
$.ajax({
url: $(this).attr('href'),
type: 'GET',
async: false,
cache: false,
วิธีนี้อาจทำให้ performance ลดลงแต่ก็ทำให้เราได้ค่าที่ต้องการมาใช้งานต่อได้
ยังไงก็ประยุกต์ใช้ตามความเหมาะสมนะครับ
ตัวอย่าง javascript สลับ ซ่อน แล้ว แสดง โดยใช้ div style value 