在 Django 项目中使用 Zurb Foundation 6 javascript

Question

我有一个现有的 Django 项目，我想在其中使用 Zurb Foundation（准确地说是版本 6.4.2）。我从文档中了解到您可以只引用 CDN 或将相关文件下载到您的静态文件夹并从那里引用它们。我通过

完成了后者

<link rel='stylesheet' href="{% static 'foundation/css/foundation.min.css' %}" type='text/css' />

<script src="{% static 'foundation/js/vendor/jquery.js' %}"></script>
<script src="{% static 'foundation/js/vendor/what-input.js' %}"></script>
<script src="{% static 'foundation/js/vendor/foundation.min.js' %}"></script>
<script>
    $(document).foundation();
</script>

css 似乎按预期工作，但 javascript 似乎根本不起作用。当我从 say enter link description here 粘贴片段时，说

<p><a data-toggle="menuBar" aria-expanded="false" aria-controls="menuBar">Expand!</a></p>
<ul class="menu" id="menuBar" data-toggler=".expanded">
    <li><a href="#">One</a></li>
    <li><a href="#">Two</a></li>
    <li><a href="#">Three</a></li>
    <li><a href="#">Four</a></li>
</ul>

没有任何反应。菜单加载但菜单不会像在链接的文档页面中那样展开。我是否没有引用正确的文件，或者我是否需要安装或加载任何我没有提到的东西？或者这是一个 Django 问题，如果是，是否有解决方法？

Answer 1

如果它很简单 JQuery。我认为将它放在底部是最佳做法，但由于您使用了 $(document).foundation();，因此必须加载页面以初始化页面上使用的基础插件。本质上，如果 page/DOM.

上不存在 x，则不能将 x 设为红色

初始化基础

包含 Foundation JavaScript 后，只需添加一个简单的调用即可初始化页面上的所有插件。

我们建议您在页面末尾初始化 Foundation。

HTML

<script>
  $(document).foundation();
</script>

取自https://foundation.zurb.com/sites/docs/v/5.5.3/javascript.html，但由于当前版本是 6.6.2

，所以已经过时了

在 Django 项目中使用 Zurb Foundation 6 javascript

Using Zurb Foundation 6 javascript in a Django project

django

zurb-foundation