ชะลอการทำงานของ jQuery s ready event. และให้ทำงานในส่วนของ script
ที่กำหนดก่อน แล้วค่อยทำงานในส่วนของ jQuery s ready event.
ทดสอบรันไฟล์ ข้างต้น เพื่อเปรียบเทียบลำดับการทำงาน
ไฟล์ jq_learn121112_1.php case 1
<!DOCTYPE html>
<html>
<head>
<style>div { color:red; }</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<script type="text/javascript">
console.log("1");
$.holdReady(true);
$.getScript("myplugin.js", function() {
console.log("2");
$.holdReady(false);
console.log("3");
});
</script>
<script type="text/javascript">
console.log("4");
$(function(){
console.log("5");
});
console.log("6");
</script>
</body>
</html>
<script type="text/javascript">
console.log("7");
</script>
ไฟล์ jq_learn121112_1.php case 2
<!DOCTYPE html>
<html>
<head>
<style>div { color:red; }</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<script type="text/javascript">
console.log("1");
//$.holdReady(true);
$.getScript("myplugin.js", function() {
console.log("2");
// $.holdReady(false);
console.log("3");
});
</script>
<script type="text/javascript">
console.log("4");
$(function(){
console.log("5");
});
console.log("6");
</script>
</body>
</html>
<script type="text/javascript">
console.log("7");
</script>
ไฟล์ myplugin.js สำหรับทดสอบ
// JavaScript Document
console.log("test sample plugin");
ดูผลลัพธ์หลังจากรันโค้ดใน แท็บ console ใน google chrome โดยกด F12
สังเกตลำดับการรันของตัวเลขที่แสดง รวมทั้งผลลัพธ์การทำงานของ ไฟล์ myplugin.js
