Javascript 放大弹出窗口不工作

我正在使用放大弹出窗口

$(document).ready(function() {
  $('.image-viewer').magnificPopup({
      type: 'ajax'
  });
});

这是html：

<a href="/site-media/{{ photo.image }}" class="image-viewer"><img class="fest-content-event-content-photo" width = "100%" src="/site-media/{{ photo.thumbnail2 }}" /></a>

---

怎么了？我没有两次加载tje jquery.js文件。

听起来您有冲突。。尝试在

文档中添加
$
。就绪

功能

$(document).ready(function($) {
  $('.image-viewer').magnificPopup({
      type: 'ajax'
  });
});

或者将

$

替换为

jQuery

此

jQuery(document).ready(function(){
      jQuery('.image-viewer').magnificPopup({
          type: 'ajax'
      });
}

---

首先，确保正确包含jQuery库：

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

---

确保将JQuery和放大js链接放在要执行的代码之前

如下所示：

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="jquery.magnific-popup.min.js"></script>
  <script>
    $(document).ready(function () {

      $('#some-btn').magnificPopup({
        items: [
          {
            src: './9414795.jpg'
          }
        ],
        gallery: {
          enabled: true
        },
        type: 'image'
      });
    });
  </script>

$（文档）.ready（函数（）{
$（“#一些btn”）.magnificPopup({
项目：[
{
src:“./9414795.jpg”
}
],
画廊：{
已启用：true
},
键入：“图像”
});
});

我想你没有读我的问题。我已经在ready函数中包含了它，在rady函数（）中还有其他代码。那么，我是否必须在任何地方都更改它，或者我应该定义另一个就绪函数？只需使用其中一个来更改

document.ready函数

，然后告诉我您是否仍然收到任何请求。如果它不工作，请提供您的全部代码。好的，我已经解决了。我将放大弹出窗口的js文件放在jQuery.js之前。现在问题解决了。好吧，酷。下次提供更多的代码，因为更容易找到bug。您的相关

代码在哪里？我们可以发现错误。。但是第一行看起来有点。。。errorish.看起来您有冲突，请尝试上面的答案，告诉我们您是否仍然收到相同的错误Jquery
fire Jquery.js:3048
引发错误，因此确保他正确地包含了该库。
jQuery(document).ready(function ($) {
     $('.image-viewer').magnificPopup({
          type: 'ajax'
     });
});

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="jquery.magnific-popup.min.js"></script>
  <script>
    $(document).ready(function () {

      $('#some-btn').magnificPopup({
        items: [
          {
            src: './9414795.jpg'
          }
        ],
        gallery: {
          enabled: true
        },
        type: 'image'
      });
    });
  </script>