我使用 noUIslider 并尝试从外部 javascript 文件初始化它。
<div id="slider-med" class="slider-success"></div><input type="text" id="med-value" value="0"/>
$( document ).ready(function() {
$('#slider-med').noUiSlider({
connect: 'lower',
start: [ 4 ],
step: 1,
range: {
'min': [ 0 ],
'max': [ 5 ]
},
format: wNumb({
decimals: 0
})
});
});
如果我将 JS 代码放在 HTML 文件的末尾，它就可以工作。如果我把它放在一个外部的 JS 文件中，它就不起作用。因为，我在页面中有很多滑块，所以我想保持清晰，并将大部分 JS 代码放在外部文件中。
编辑：这是我的脚本在 html 代码末尾的顺序：
<script type="text/javascript" src="/static/js/jquery.min.js"></script>
<script type="text/javascript" src="/static/noUiSlider/jquery.nouislider.all.min.js"></script>
<script type="text/javascript" src="/static/js/materialize.min.js"></script>
<script type="text/javascript" src="/static/js/cookies.js"></script>
<script type="text/javascript" src="/static/js/custom.js"></script>
custom.js 是带有滑块的。