TypeError: $(...).magnificPopup 不是函数

Question

我在使用 chrome 开发者版。该库未加载，我不明白为什么。该错误在 chrome 控制台中报告。这是我的代码：

 <ul><li><a class="mediaimage-link" href="~/img/HP/mediakit/The-CorPath-Vascular-Robotic-System_HR.jpg"><img src="~/img/HP/The-CorPath-Vascular Robotic-System-187.jpg" alt="">
</a></li>
<li><a href="https://www.youtube.com/watch?v=TnQsToiKKgw?rel=0&amp;showinfo=0" class="popup-youtube"> <img src="~/img/HP/Iyer-Video-187.jpg" alt=""></a>
         </li>
</ul>

 $(document).ready(function() {
  //Media Image Popup
  $('.mediaimage-link').magnificPopup({type:'image'});
  //Video Iframe Popup
    $('.popup-youtube').magnificPopup({
          disableOn: 700,
          type: 'iframe',
          mainClass: 'mfp-fade',
          removalDelay: 160,
          preloader: false,
          fixedContentPos: false
        });
});`

原文由 Hitesh Rawat 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可能没有在代码中包含 JQuery 库。请记住，JQuery 文件必须放在所有其他 Javascript 代码之上。

原文由 ajith 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

$(document).ready(function ($) {
    $('.test-popup-link').magnificPopup({
    type: 'image',
    gallery: {
            enabled: true,
            navigateByImgClick: true,
            preload: [0,1] // Will preload 0 - before current, and 1 after the current image
          }
    // other options
  });
  });

只需将 \( 传入 `\)(document).ready(function ($)` 它将开始工作

原文由 Muhammad Aßdüllah 发布，翻译遵循 CC BY-SA 4.0 许可协议