การแก้ไขข้อผิดพลาด jQuery ไม่ได้ถูกกำหนด”

เผยแพร่แล้ว: 2024-03-27

ข้อผิดพลาด “jQuery is Not Defined” เป็นอุปสรรค์ทั่วไปที่พบในการพัฒนาเว็บ โดยเฉพาะอย่างยิ่งสำหรับผู้ที่เพิ่งเริ่มรวม jQuery ซึ่งเป็นไลบรารี JavaScript ที่ใช้กันอย่างแพร่หลายเข้ากับหน้าเว็บ ข้อความแสดงข้อผิดพลาดนี้ปรากฏขึ้นในคอนโซลของเบราว์เซอร์เมื่อโค้ด JavaScript พยายามใช้ไวยากรณ์หรือฟังก์ชัน jQuery ก่อนที่จะโหลดไลบรารี หรือหากยังไม่ได้โหลดเลย โดยพื้นฐานแล้ว มันเป็นวิธีการของเบราว์เซอร์ในการพูดว่า “ฉันไม่รู้ว่า jQuery คืออะไร” ซึ่งทำให้ต้องหยุดการเรียกใช้สคริปต์ที่เกี่ยวข้องกับ jQuery ทันที

การเปลี่ยนแปลงของข้อผิดพลาด

ข้อผิดพลาด “jQuery is Not Defined” สามารถแสดงออกมาได้หลายวิธี ขึ้นอยู่กับเบราว์เซอร์ สภาพแวดล้อม (เช่น สภาพแวดล้อมการพัฒนากับเซิร์ฟเวอร์ที่ใช้งานจริง) หรือวิธีที่สคริปต์รวมอยู่ในหน้าเว็บ รูปแบบทั่วไปของข้อความแสดงข้อผิดพลาดนี้ได้แก่:

  • jQuery ไม่ได้ถูกกำหนดไว้
  • $ ไม่ได้กำหนดไว้
  • Uncaught ReferenceError: $ ไม่ได้ถูกกำหนดไว้
  • Uncaught ReferenceError: jQuery ไม่ได้ถูกกำหนดไว้
  • ReferenceError: jQuery ไม่ได้ถูกกำหนดไว้
  • ReferenceError: $ ไม่ได้ถูกกำหนดไว้
  • ประเภทข้อผิดพลาด: $(...) ไม่ใช่ฟังก์ชัน
  • TypeError: jQuery(...) ไม่ใช่ฟังก์ชัน

ทำความเข้าใจกับ “jQuery ไม่ได้ถูกกำหนด” ใน WordPress

ในระบบนิเวศของ WordPress นั้น jQuery ถูกใช้อย่างกว้างขวางโดยธีมและปลั๊กอินเพื่อเพิ่มการโต้ตอบและปรับปรุงประสบการณ์ผู้ใช้ บางทีปลั๊กอินที่คุณใช้อาจได้รับการออกแบบมาเพื่อใช้ประโยชน์จาก jQuery สำหรับฟังก์ชันการทำงานของปลั๊กอิน เช่น แถบเลื่อน ป๊อปอัป การตรวจสอบความถูกต้องของแบบฟอร์ม และอื่นๆ เมื่อเบราว์เซอร์รายงานว่า “ไม่ได้กำหนด jQuery” หมายความว่า JavaScript ของไซต์ของคุณพยายามเรียกใช้ฟังก์ชัน jQuery ก่อนที่ jQuery จะโหลดขึ้นมา หรือยังไม่ได้โหลดเลย

สาเหตุทั่วไปของข้อผิดพลาดนี้ใน WordPress

สถานการณ์ต่างๆ เฉพาะสำหรับ WordPress อาจทำให้เกิดข้อผิดพลาดนี้ได้ รวมถึง:

ธีมและปลั๊กอิน : ธีมหรือปลั๊กอินที่จัดคิว jQuery ไม่ถูกต้อง หรือใช้เวอร์ชันเก่า อาจทำให้เกิดปัญหานี้ได้

การแก้ไขด้วยตนเอง : การแก้ไขไฟล์ธีมแบบกำหนดเอง โดยเฉพาะอย่างยิ่งหาก jQuery ถูกยกเลิกการลงทะเบียนด้วยตนเองหรือจัดคิวไม่ถูกต้อง อาจส่งผลให้เกิดข้อผิดพลาดนี้ได้

ข้อขัดแย้ง : บางครั้งการติดตั้งปลั๊กอินหลายตัวที่พยายามโหลด jQuery เวอร์ชันของตัวเองอาจทำให้เกิดข้อขัดแย้งและทำให้เกิดข้อผิดพลาดตามมา

สาเหตุทั่วไปของข้อผิดพลาดนี้

ลำดับสคริปต์ไม่ถูกต้อง : สาเหตุที่พบบ่อยที่สุดคือหน้า HTML ของคุณพยายามใช้ jQuery ก่อนที่จะโหลดสคริปต์ที่ใช้ jQuery จะต้องวางไว้หลัง แท็ก<script> ของไลบรารี jQuery

ความล้มเหลวในการรวม jQuery : เพียงลืมที่จะรวม jQuery บนหน้าเว็บของคุณอาจทำให้เกิดข้อผิดพลาดนี้ได้ตรวจสอบให้แน่ใจว่าคุณมี แท็ก<script> ที่แหล่งที่มาของไลบรารี jQuery อย่างถูกต้อง

ไลบรารีที่ขัดแย้งกัน : บางครั้งไลบรารีหรือสคริปต์ JavaScript อื่น ๆ อาจขัดแย้งกับ jQuery โดยเฉพาะอย่างยิ่งหากพวกเขาใช้ สัญลักษณ์ $ด้วย สิ่งนี้อาจทำให้ jQuery ถูกเขียนทับหรือเริ่มต้นไม่ถูกต้องโดยไม่ตั้งใจ

ปัญหาการแคช : ในบางกรณี เบราว์เซอร์ของคุณอาจแคชหน้าเว็บเวอร์ชันเก่าของคุณที่ไม่มี jQuery หรือเส้นทางไปยัง jQuery อาจไม่ถูกต้อง ส่งผลให้โหลดไลบรารีล้มเหลว

ปัญหาเครือข่ายการจัดส่งเนื้อหา (CDN) : หากคุณกำลังโหลด jQuery จาก CDN และ CDN ใช้งานไม่ได้หรือไม่สามารถเข้าถึงได้ เว็บไซต์ของคุณจะไม่สามารถโหลดไลบรารีได้ ซึ่งส่งผลให้เกิดข้อผิดพลาดนี้

วิธีแก้ไขข้อผิดพลาดไม่ได้กำหนด jQuery

ก่อนทำการเปลี่ยนแปลงใดๆ การตรวจสอบให้แน่ใจว่าคุณมีการสำรองข้อมูลเว็บไซต์อย่างครบถ้วนเป็นสิ่งสำคัญ หากคุณมีสิทธิ์เข้าถึงสภาพแวดล้อมชั่วคราวหรือการพัฒนา คุณสามารถใช้สภาพแวดล้อมนั้นเพื่อแก้ไขข้อผิดพลาด และหลีกเลี่ยงการหยุดชะงักที่อาจเกิดขึ้นจากการแก้ไขโดยตรงบนไซต์ที่ใช้งานจริง

ด้วยมาตรการป้องกันเหล่านี้ คุณก็พร้อมที่จะจัดการกับข้อผิดพลาด “jQuery is not Defed” แล้ว

ตรวจสอบว่าโหลด jQuery แล้วโดยทดสอบแหล่งสคริปต์

สาเหตุทั่วไปประการหนึ่งที่อยู่เบื้องหลังปัญหานี้ก็คือ แม้ว่า jQuery อาจรวมอยู่ด้วย แต่โหลดไม่ถูกต้องเนื่องจากสาเหตุหลายประการ เช่น URL ไม่ถูกต้อง ปัญหาเครือข่าย หรือการอนุญาตการเข้าถึงไฟล์ เพื่อตรวจสอบว่าโหลด jQuery อย่างถูกต้องหรือไม่ วิธีการที่เรียบง่ายแต่มีประสิทธิภาพคือการทดสอบแหล่งสคริปต์ในเบราว์เซอร์ของคุณโดยตรง

ขั้นตอนในการทดสอบซอร์สสคริปต์ jQuery

  1. ขั้นแรก คุณต้องค้นหาแท็กสคริปต์ที่มี jQuery ในโค้ด HTML ของคุณ แท็กนี้มีความสำคัญเนื่องจากจะระบุแหล่งที่มาที่ควรโหลด jQuery ค้นหาบรรทัดในโค้ดของคุณที่มีลักษณะดังนี้:
  2.  <script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
  3. คุณลักษณะ src นี้ มี URL ของไลบรารี jQuery ที่คุณพยายามโหลด
  4. แยก URL ออกจาก แอตทริบิวต์ src ของแท็กสคริปต์นี่คือลิงก์โดยตรงไปยังไฟล์ jQuery ที่คุณรวมไว้ในเว็บไซต์ของคุณ ตรวจสอบให้แน่ใจว่าคุณคัดลอก URL ทั้งหมดอย่างถูกต้อง รวมถึง ส่วนhttp:// หรือ https://ที่ตอนต้นด้วย
  5. เปิดแท็บหรือหน้าต่างใหม่ในเว็บเบราว์เซอร์ของคุณ และวาง URL ที่คัดลอกลงในแถบที่อยู่ กด Enter เพื่อไปยัง URL นี้

หากโหลดไฟล์ jQuery อย่างถูกต้อง คุณจะเห็นเนื้อหาทั้งหมดของไลบรารี jQuery แสดงเป็นข้อความธรรมดาในเบราว์เซอร์ของคุณ สิ่งนี้บ่งชี้ว่าแหล่งสคริปต์ jQuery สามารถเข้าถึงได้และทำงานตามที่คาดไว้

วิธีการอื่นเพื่อตรวจสอบการโหลด jQuery

วิธีตรวจสอบการโหลด jQuery ผ่านแหล่งที่มาของหน้า

การใช้ View Page Source เพื่อค้นหาการโหลด jQuery

  1. นำทางไปยังหน้าเว็บที่คุณต้องการตรวจสอบโดยใช้เว็บเบราว์เซอร์ที่คุณต้องการ
  2. คลิกขวาที่ใดก็ได้บนหน้าเว็บแล้วเลือกดูแหล่งที่มาของหน้า จากเมนูบริบทตัวเลือกนี้อาจแตกต่างกันเล็กน้อยระหว่างเบราว์เซอร์
  3. เมื่อเปิดซอร์สโค้ดแล้ว ตอนนี้คุณจะต้องค้นหาการรวมสคริปต์ jQuery ซึ่งสามารถทำได้ง่ายๆ โดยใช้ฟังก์ชันการค้นหาที่มีอยู่ในเบราว์เซอร์ของคุณ:
  4. กดCtrl+F บน Windows หรือ Command+Fบน Mac เพื่อเปิดแถบค้นหา
  5. พิมพ์jquery ในช่องค้นหาแล้วกด Enterการดำเนินการนี้จะเน้นการเกิดขึ้นของ jquery ทั้งหมดในซอร์สโค้ด
  6. มองหาบรรทัดในผลลัพธ์ที่ไฮไลต์ซึ่งมีลักษณะคล้ายกับแท็กสคริปต์ที่เชื่อมโยงกับไลบรารี jQuery

อาจมีลักษณะดังนี้:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

หรือสำหรับ jQuery ที่โฮสต์ในเครื่อง บางอย่างเช่นนี้:

 <script src="/path/to/jquery.min.js"></script>

หากคุณพบบรรทัดดังกล่าว jQuery จะรวมอยู่ในเพจของคุณ หากไม่เป็นเช่นนั้น แสดงว่า jQuery อาจไม่โหลดได้ ซึ่งอาจทำให้เกิดปัญหาที่คุณกำลังประสบอยู่

การใช้เครื่องมือสำหรับนักพัฒนาเพื่อตรวจสอบการโหลด jQuery

การใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์เพื่อกำหนดการโหลด jQuery

  1. เข้าถึงเว็บไซต์ของคุณและเปิดเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ในเบราว์เซอร์ของคุณ โดยทั่วไปสามารถทำได้โดยการคลิกขวาที่หน้าแล้วเลือกInspect หรือกด F12หรือCtrl+Shift+I(Windows) /Cmd+Option+I(Mac)
  2. ภายในเครื่องมือสำหรับนักพัฒนา ให้ค้นหาและคลิกที่ แท็เครือข่ายแท็บนี้แสดงคำขอเครือข่ายทั้งหมดที่เว็บไซต์ของคุณทำในขณะที่โหลด
  3. เลือก ตัวเลือกปิดการใช้งานแคช และเมื่อเปิดแท็บเครือข่าย ให้โหลดเว็บไซต์ของคุณซ้ำเพื่อบันทึกกิจกรรมการโหลดทั้งหมด
  4. ใช้ตัวเลือกตัวกรองเพื่อจำกัดผลลัพธ์ให้แคบลงเหลือเพียงไฟล์ JavaScript โดยทั่วไปคุณสามารถทำได้โดยเลือก ตัวกรอง JS หรือพิมพ์ jqueryลงในตัวกรอง/ช่องค้นหา
  5. เลื่อนดูรายการสคริปต์ที่กำลังโหลดหรือใช้ฟังก์ชันค้นหาภายในแท็บเครือข่ายเพื่อค้นหารายการที่เกี่ยวข้องกับ jQuery คุณกำลังมองหาไฟล์ที่มีjquery อยู่ในชื่อ ซึ่งบ่งชี้ว่าไลบรารี jQuery กำลังถูกโหลด

ตรวจสอบให้แน่ใจว่า jQuery ถูกรวมไว้ใน WordPress อย่างถูกต้อง

หากคุณพบว่า jQuery ไม่ได้ถูกโหลดหรือคุณประสบปัญหาแม้ว่าจะมีอยู่ คุณอาจต้องตรวจสอบให้แน่ใจว่าได้รวมไว้ในธีมหรือปลั๊กอิน WordPress ของคุณอย่างถูกต้อง WordPress นำเสนอวิธีที่มีประสิทธิภาพในการจัดการสคริปต์ผ่าน ฟังก์ชัน wp_enqueue_scriptแนะนำให้ใช้วิธีนี้เนื่องจากจะจัดการการขึ้นต่อกันของสคริปต์ได้อย่างมีประสิทธิภาพและช่วยหลีกเลี่ยงข้อขัดแย้ง

จัดคิว jQuery ใน WordPress

  1. เชื่อมต่อกับไซต์ WordPress ของคุณโดยใช้ไคลเอนต์ FTP หรือตัวจัดการไฟล์ที่บริการโฮสติ้งของคุณมอบให้
  2. ไปที่โฟลเดอร์ธีม ของคุณ และค้นหา ไฟล์ function.phpขอแนะนำให้สร้างธีมลูกและทำการเปลี่ยนแปลงที่นั่นเพื่อหลีกเลี่ยงการสูญเสียการปรับแต่งเมื่อธีมของคุณอัปเดต
  3. หาก jQuery หายไป คุณสามารถจัดคิวได้โดยเพิ่มข้อมูลโค้ดต่อไปนี้ลงใน ไฟล์function.php ของคุณ :
 ฟังก์ชั่น my_theme_enqueue_scripts() {

 wp_enqueue_script('jquery');

-

add_action('wp_enqueue_scripts', 'my_theme_enqueue_scripts');

เพื่อให้แน่ใจว่า WordPress รวม jQuery ไว้ในทุกหน้าของเว็บไซต์ของคุณ

หากคุณกำลังเพิ่มสคริปต์ที่กำหนดเองซึ่งขึ้นอยู่กับ jQuery ตรวจสอบให้แน่ใจว่าได้แสดงรายการ jQuery เป็นการขึ้นต่อกัน เช่น:

 wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/js/custom-script.js', array('jquery'), '1.0', จริง );

ใช้ทางเลือกท้องถิ่นกับ jQuery ที่โฮสต์โดย Google

การรวม jQuery เวอร์ชันที่โฮสต์โดย Google ในเว็บไซต์ของคุณเป็นวิธีปฏิบัติทั่วไปในการใช้ประโยชน์จาก CDN ของ Google เพื่อการส่งมอบไลบรารี JavaScript ยอดนิยมนี้ที่รวดเร็วและเชื่อถือได้ อย่างไรก็ตาม เพื่อให้แน่ใจว่าเว็บไซต์ของคุณยังคงแข็งแกร่งต่อการหยุดทำงานของ CDN หรือปัญหาเครือข่าย การใช้ทางเลือกสำรองในเครื่องถือเป็นสิ่งสำคัญ การตั้งค่านี้ช่วยให้ไซต์ของคุณใช้ jQuery เวอร์ชันที่โฮสต์ในเครื่องได้โดยอัตโนมัติ หากเวอร์ชันที่โฮสต์โดย Google ไม่สามารถโหลดได้ไม่ว่าด้วยเหตุผลใดก็ตาม วิธีการนี้เป็นไปตามแนวทางปฏิบัติที่ดีที่สุดในการพัฒนาเว็บโดยการเพิ่มประสิทธิภาพการทำงานในขณะเดียวกันก็รับประกันความซ้ำซ้อน ด้านล่างนี้เป็นคำแนะนำทีละขั้นตอนในการใช้กลยุทธ์นี้อย่างมีประสิทธิภาพ

รวม jQuery ที่โฮสต์โดย Google

ขั้นแรก คุณต้องเพิ่มแท็กสคริปต์ jQuery ที่โฮสต์โดย Google ลงในเว็บไซต์ของคุณ วางแท็กนี้ไว้ภายใน ส่วน <head> ของเอกสาร HTML ของคุณหรือก่อนแท็กปิด </body>เพื่อให้แน่ใจว่าสคริปต์อื่นๆ ที่ขึ้นอยู่กับ jQuery สามารถใช้งานได้ ตัวอย่างเช่น:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

เพิ่มสคริปต์ทางเลือกในเครื่อง

ทันทีหลังจากแท็กสคริปต์สำหรับ jQuery ที่โฮสต์โดย Google คุณจะเพิ่ม JavaScript ชิ้นเล็กๆ สคริปต์นี้จะตรวจสอบว่าโหลด jQuery จาก Google CDN สำเร็จหรือไม่ ถ้าไม่เช่นนั้น ระบบจะเขียนแท็กสคริปต์ใหม่แบบไดนามิกลงในเอกสาร HTML ของคุณเพื่อโหลด jQuery จากแหล่งที่มาในเครื่อง

 <สคริปต์>

 window.jQuery || document.write('<script src="/path/to/local/jquery-3.5.1.min.js"><\/script>');

</สคริปต์>

ตรวจสอบให้แน่ใจว่าได้แทนที่“/path/to/local/jquery-3.5.1.min.js” ด้วยเส้นทางที่ถูกต้องไปยังไฟล์ jQuery ที่โฮสต์บนเซิร์ฟเวอร์ของคุณ

ทำความเข้าใจโค้ด

window.jQuery : ส่วนนี้ของสคริปต์จะตรวจสอบว่าวัตถุ jQuery พร้อมใช้งานทั่วโลกหรือไม่ ซึ่งจะระบุว่าโหลด jQuery สำเร็จแล้ว

document.write : วิธีการนี้ใช้ในการแทรก HTML ลงในเอกสารใช้ที่นี่เพื่อเพิ่มแท็กสคริปต์สำหรับไฟล์ jQuery ในเครื่องหากไม่ได้โหลดเวอร์ชัน CDN ลำดับการหลีก<\/script> ใช้เพื่อป้องกันไม่ให้สตริงถูกตีความเป็นจุดสิ้นสุดของบล็อกสคริปต์

ทำความเข้าใจกลไกทางเลือก

กลไกทางเลือกดำเนินการด้วยการตรวจสอบง่ายๆ : window.jQueryหากไม่ได้กำหนดวัตถุ jQuery แสดงว่าเวอร์ชัน CDN โหลดไม่ถูกต้อง จากนั้นใช้เมธอดdocument.write เพื่อ ฉีดแท็ก <script>ใหม่ ที่โหลด jQuery จากไฟล์ในเครื่อง

ประโยชน์

  • ตรวจสอบให้แน่ใจว่า jQuery พร้อมใช้งานเสมอ แม้ว่า CDN จะล้มเหลวก็ตาม
  • การโหลด jQuery ภายในเครื่องสามารถลดเวลาแฝงได้ในบางสถานการณ์ โดยเฉพาะอย่างยิ่งหากเวอร์ชัน CDN ตอบสนองช้าหรือหากเครือข่ายของผู้ใช้มีปัญหาในการเชื่อมต่อกับ CDN
  • การมีสำเนาในเครื่องช่วยให้คุณควบคุมเวอร์ชันของ jQuery ที่ใช้งานอยู่ได้ ทำให้สามารถทดสอบและแก้ไขจุดบกพร่องได้อย่างสม่ำเสมอ

เพิ่มข้อมูลโค้ดลงในไฟล์ wp-config.php

เมื่อคุณลองวิธีการต่างๆ เพื่อแก้ไขข้อผิดพลาด “jQuery is not Defed” หรือปัญหา JavaScript ที่คล้ายกันใน WordPress โดยไม่ประสบผลสำเร็จ การปิดใช้งานการต่อสคริปต์อาจเป็นขั้นตอนการแก้ไขปัญหาที่มีประโยชน์ การต่อสคริปต์เป็นคุณลักษณะ WordPress ที่รวมไฟล์ JavaScript หลายไฟล์ไว้ในคำขอเดียวเพื่อปรับปรุงเวลาในการโหลด อย่างไรก็ตาม บางครั้งอาจทำให้เกิดข้อผิดพลาดหรือเกิดปัญหาในการโหลดสคริปต์ โดยเฉพาะอย่างยิ่งหากมีข้อขัดแย้งหรือสคริปต์ใดโหลดไม่ถูกต้อง

การแก้ไขไฟล์ wp-config.php

ใช้ไคลเอนต์ FTP หรือตัวจัดการไฟล์ที่ได้รับจากแผงควบคุมเว็บโฮสติ้งของคุณเพื่อเข้าถึงไฟล์ของไซต์ WordPress ของคุณ

เปิด ไฟล์ wp-config.php ในโปรแกรมแก้ไขข้อความหากคุณใช้ไคลเอนต์ FTP คุณจะต้องดาวน์โหลดไฟล์ก่อน จากนั้นเปิดด้วยโปรแกรมแก้ไขข้อความในคอมพิวเตอร์ของคุณ จากนั้นจึงอัปโหลดกลับหลังจากแก้ไข หากคุณใช้ตัวจัดการไฟล์ในแผงควบคุมเว็บโฮสติ้ง คุณสามารถแก้ไขไฟล์ได้โดยตรงในเบราว์เซอร์ของคุณ

เลื่อนไปที่ด้านล่างของไฟล์ ก่อนบรรทัดที่อ่านว่า/* แค่นี้เอง หยุดแก้ไข!มีความสุขในการเขียนบล็อก*/ .ที่นี่ วางข้อมูลโค้ดต่อไปนี้:

 /** เส้นทางที่แน่นอนไปยังไดเร็กทอรี WordPress -

 ถ้า ( !กำหนด('ABSPATH') )

 กำหนด('ABSPATH', dirname(__FILE__) . '/');

 กำหนด('CONCATENATE_SCRIPTS', false);

หลังจากเพิ่มข้อมูลโค้ดแล้ว ให้บันทึกการเปลี่ยนแปลงของคุณ หากคุณกำลังแก้ไขไฟล์ในเครื่องคอมพิวเตอร์ของคุณ ตรวจสอบให้แน่ใจว่าได้อัปโหลดไฟล์กลับไปยังเซิร์ฟเวอร์ โดยแทนที่wp-config.php ที่มี อยู่

ทำความเข้าใจกับตัวอย่าง

คำจำกัดความของ ABSPATH : บรรทัดนี้ช่วยให้แน่ใจว่าเส้นทางที่แน่นอนไปยังไดเร็กทอรี WordPress ถูกกำหนดอย่างถูกต้อง ซึ่งเป็นข้อกำหนดพื้นฐานสำหรับ WordPress ในการทำงานอย่างถูกต้อง

ปิดการใช้งานการต่อข้อมูล : บรรทัด `define('CONCATENATE_SCRIPTS', false);` แจ้ง WordPress อย่างชัดเจนว่าอย่าลิงก์สคริปต์วิธีนี้สามารถช่วยในการแก้ไขข้อบกพร่องของสคริปต์ได้โดยการโหลดแต่ละสคริปต์แยกกัน ช่วยให้ระบุได้ง่ายขึ้นว่าสคริปต์ใดที่อาจทำให้เกิดปัญหา

เพิ่มไลบรารี jQuery ด้วยตนเอง

การรวมไลบรารี jQuery ลงในไฟล์header.php ของธีม WordPress โดยตรงด้วยตนเอง เป็นแนวทางที่ไม่ซับซ้อน โดยเฉพาะอย่างยิ่งเมื่อวิธีอื่นๆ ในการแก้ไขปัญหาที่เกี่ยวข้องกับ jQuery ไม่ประสบผลสำเร็จวิธีการนี้ช่วยให้แน่ใจว่า jQuery ได้รับการโหลดตั้งแต่เนิ่นๆ ในกระบวนการเรนเดอร์เพจ ซึ่งจะช่วยลดความเสี่ยงของข้อผิดพลาด “jQuery is not Defed”

วิธีรวมไลบรารี jQuery ด้วยตนเอง

  1. ไปที่ หน้า Google Hosted Libraries เพื่อเข้าถึง jQuery เวอร์ชันล่าสุด
  2. ค้นหา jQuery เวอร์ชันล่าสุดที่แสดงอยู่บนหน้าและคัดลอกแท็กสคริปต์ที่ให้ไว้
  3. ใช้ไคลเอนต์ FTP หรือตัวจัดการไฟล์ที่ได้รับจากบริการโฮสติ้งของคุณเพื่อเข้าถึงไฟล์ของเว็บไซต์ WordPress
  4. ภายในไดเร็กทอรี WordPress ของคุณ ให้ไปที่wp-content/themes/your-theme-folder/ และค้นหา ไฟล์ header.phpแทนที่your-theme-folder ด้วยชื่อจริงของธีมของคุณ
  5. เปิด ไฟล์ header.php ในโปรแกรมแก้ไขข้อความหากคุณใช้ตัวจัดการไฟล์ผ่านแผงควบคุมเว็บโฮสติ้ง คุณอาจแก้ไขไฟล์ได้โดยตรงในเบราว์เซอร์ของคุณ
  6. ไฟล์ส่วนหัว php ในโฟลเดอร์ธีมที่เข้าถึงได้ผ่านไคลเอนต์ FTP

  7. วางแท็กสคริปต์ jQuery ที่คุณคัดลอกมาจาก Google Hosted Libraries ต่อจากแท็กเปิด<head> ใน ไฟล์ header.phpของคุณ การวางไว้ใกล้กับส่วนบนสุดของส่วนหัวทำให้แน่ใจได้ว่า jQuery ได้รับการโหลดตั้งแต่เนิ่นๆ และพร้อมใช้งานสำหรับสคริปต์ใดๆ ก็ตามที่ขึ้นอยู่กับส่วนนั้น
  8. ตัวอย่างเช่น,

     <หัว>
    
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    
     <!-- เนื้อหาส่วนหัวอื่นๆ ของคุณด้านล่าง -->
  9. หลังจากเพิ่มแท็กสคริปต์แล้ว ให้บันทึก ไฟล์header.phpหากคุณแก้ไขไฟล์ในเครื่องคอมพิวเตอร์ของคุณ อย่าลืมอัปโหลดไฟล์นั้นกลับไปยังเซิร์ฟเวอร์ โดยแทนที่ไฟล์เวอร์ชันเก่า

ข้อควรพิจารณาที่สำคัญ

ธีมลูก : หากคุณกำลังเปลี่ยนแปลงธีมโดยตรง แนวทางปฏิบัติที่ดีที่สุดคือใช้ธีมลูกวิธีนี้จะป้องกันไม่ให้การเปลี่ยนแปลงของคุณถูกเขียนทับเมื่อมีการอัปเดตธีมหลัก

ทดสอบไซต์ของคุณ : หลังจากเพิ่ม jQuery ด้วยตนเองแล้ว ให้ทดสอบไซต์ของคุณอย่างละเอียดเพื่อให้แน่ใจว่าสคริปต์ทำงานตามที่คาดไว้และไม่มีปัญหาความเข้ากันได้

ปิดความคิด

ในบล็อกของเรา เราได้สำรวจวิธีแก้ปัญหาต่างๆ เพื่อแก้ไขข้อผิดพลาด “jQuery is not Defined” โดยเน้นถึงความสำคัญของการทำให้แน่ใจว่า jQuery ได้รับการโหลดและนำไปใช้อย่างถูกต้องบนเว็บไซต์ เราครอบคลุมการตรวจสอบการมีอยู่ของ jQuery ผ่านการตรวจสอบแหล่งที่มาของหน้าและแท็บเครือข่ายของเบราว์เซอร์ และเราหารือเกี่ยวกับการเพิ่มความน่าเชื่อถือของไซต์ด้วย jQuery ที่โฮสต์โดย Google เสริมด้วยทางเลือกท้องถิ่น นอกจากนี้ เรายังศึกษาเทคนิคการแก้ไขปัญหา WordPress ขั้นสูง เช่น การปิดใช้งานการต่อสคริปต์ใน ไฟล์ wp-config.php และเพิ่ม jQuery ลงใน ไฟล์ header.phpของธีม ด้วยตนเอง ตลอดระยะเวลาที่ผ่านมา มีการเน้นไปที่หลักปฏิบัติในการแก้ไขอย่างระมัดระวัง รวมถึงการใช้สภาพแวดล้อมชั่วคราวและธีมย่อยเพื่อการแก้ไขอย่างปลอดภัย เพื่อรักษาฟังก์ชันการทำงานของเว็บไซต์และประสบการณ์ผู้ใช้

เร่งการสร้างเว็บไซต์ WordPress ของคุณด้วย AI

สร้างเว็บไซต์ WordPress แบบกำหนดเองที่ปรับแต่งให้เหมาะกับความต้องการทางธุรกิจของคุณ เร็วขึ้น 10 เท่าด้วย 10Web AI Website Builder

สร้างเว็บไซต์ของคุณ
ไม่ต้องใช้บัตรเครดิต