django模板中的JQuery滑块

我试图在Django模板中添加JQuery滑块，但它不起作用

我的主模板：

...
<div>
<dt class="nav-header">Size</dt>
    <dd>
        {% include 'catalogue/slider_size.html' %}
    </dd>
</div>
...

。。。
大小
{%include'catalog/slider\u size.html%}
...

模板滑块_size.html：

<link rel="stylesheet" href="slider.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function() {
  $( "#slider-range" ).slider({
    range: true,
    min: 0,
    max: 500,
    values: [ 75, 300 ],
    slide: function( event, ui ) {
      $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
    }
  });
  $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
    " - $" + $( "#slider-range" ).slider( "values", 1 ) );
} );
</script>

<p>
  <label for="amount">Price range:</label>
  <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>

<div id="slider-range"></div>

$（函数（）{
$（“#滑块范围”）。滑块({
范围：对，
分:0,，
最高：500，
数值：[75300]，
幻灯片：功能（事件、用户界面）{
$（“#amount”）.val（“$”+ui.values[0]+“-$”+ui.values[1]）；
}
});
$（“#金额”）.val（$”+$（“#滑块范围”）.slider（“值”，0）+
“-$”+$（“#滑块范围”）。滑块（“值”，1）；
} );

价格范围：

控制台中的错误：

---

有什么想法吗？提前感谢。

主模板中包含哪些脚本？它可能是重复的，这就是它！重复导入。。。非常感谢您的帮助Foocli:）是的，通常情况下，您应该更改编写模板的方式：制作基础模板，为所有css和JS文件创建块，包括导航栏和页脚，然后为每个页面扩展基础。通常只有base将包含导入的文件，这样您就不会再次遇到此问题，而且它更干净。如果需要在其他模板中包含不同的脚本集，请覆盖该块，以便base中的脚本消失。