我正在尝试将 J 查询与 tiwg 一起使用，并且有一些文件需要包含到 html 模板中。我有一个 base.html 模板，然后由其他模板扩展，如下所示。每次我添加对所需 JQuery 脚本的引用时，页面都不会加载。我一定做错了什么。
谢谢
{% extends "base.html" %}
{% block content %}
<!-- page content -->
{% endblock %}
{% block javascripts %}
<script type="text/javascript" src="{{ assets('js/jquery.min.js') }}"></script>
<script type="text/javascript" src="{{ assets('js/wizard/jquery.smartWizard.js') }}"></script>
{% endblock %}
我已将 jquery 添加到页面顶部而不是底部，但我仍然无法让 jquery 智能向导正常工作，这是我的代码。对jquery的引用在base.html中
{% extends "base.html" %}
{% block content %}
<!-- page content -->
<div class="row">
<div id="wizard" class="swMain">
<ul>
<li><a href="#step-1">
<label class="stepNumber">1</label>
<span class="stepDesc">
Step 1<br />
<small>Step 1 description</small>
</span>
</a></li>
<li><a href="#step-2">
<label class="stepNumber">2</label>
<span class="stepDesc">
Step 2<br />
<small>Step 2 description</small>
</span>
</a></li>
<li><a href="#step-3">
<label class="stepNumber">3</label>
<span class="stepDesc">
Step 3<br />
<small>Step 3 description</small>
</span>
</a></li>
<li><a href="#step-4">
<label class="stepNumber">4</label>
<span class="stepDesc">
Step 4<br />
<small>Step 4 description</small>
</span>
</a></li>
</ul>
<div id="step-1">
<h2 class="StepTitle">Step 1 Content</h2>
<!-- step content -->
</div>
<div id="step-2">
<h2 class="StepTitle">Step 2 Content</h2>
<!-- step content -->
</div>
<div id="step-3">
<h2 class="StepTitle">Step 3 Title</h2>
<!-- step content -->
</div>
<div id="step-4">
<h2 class="StepTitle">Step 4 Title</h2>
<!-- step content -->
</div>
</div>
</div>
{% endblock %}
{% block javascripts %}
<script type="text/javascript" src="assets/js/wizard/jquery.smartWizard.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// Initialize Smart Wizard
$('#wizard').smartWizard();
});
</script>
{% endblock %}
这是使用 symfony 和 twig 渲染模板时的一个已知问题：
您的 base.html 文件应如下所示：
<!DOCTYPE>
<html>
<head>
<!-- Here your css files and jQuery-->
<script type="text/javascript" src="{{ assets('js/jquery.min.js') }}"></script>
</head>
<body>
{% block content %}
{#
The content of other files will be rendered here !
That means you need to include jQuery before this point
in your base.html
#}
{% endblock %}
</body>
{% block javascripts %}
{#if you include jquery here, the scripts that need jquery will fail because jquery exists since this point !#}
<script type="text/javascript" src="{{ assets('js/wizard/jquery.smartWizard.js') }}"></script>
{% endblock %}
</html>
然后在任何扩展文件中您将能够执行 jQuery。
注意：如果您的 base.html.twig 文件中有一个现有的 javascript 块，那么您不能在扩展视图中创建另一个 JavaScript 块，因为内容将被替换（使用 {{parent()}} 来解决这个，阅读这里）
我认为主要错误是你在资产调用中有一个“s”。
它应该是没有“s”的资产
{{ asset('js/jquery.min.js') }}
而不是
{{ assets('js/jquery.min.js') }}
假设在base.html.twig中调用了jquery，当您在模板中覆盖它时，您可以使用 {{parent() }} 来获取块javascript的初始内容
所以，你的base.html是这样的
{% block javascripts %}
<script type="text/javascript" src="{{ asset('js/jquery.min.js') }}"></script>
{% endblock %}
以及扩展base.html的模板
{% block javascripts %}
{{ parent() }}
<script type="text/javascript" src="{{ asset('js/wizard/jquery.smartWizard.js') }}"></script>
<script type="text/javascript">
$(document).ready(function() {
// Initialize Smart Wizard
$('#wizard').smartWizard();
});
</script>
{% endblock %}