jQRangeSlider 不能与 Bootstrap 一起使用？版本冲突？

Question

编辑：问题得到解决。这是一个粗心的初学者错误。

我想在我的基于 Nodejs / Express 的 web 应用程序中使用 jQRangeSlider 插件。它有一个漂亮的数据范围滑块 (here's a simple jsfiddle)，我打算与 Bootstrap Datepicker Plugin 结合使用。但是，我无法使其正常工作，即滑块应位于的位置没有显示任何内容。

令我困惑的是控制台中没有错误（powershell / firefox dev-console 都没有）。 我想知道这是否是插件或依赖项的版本或冲突问题。 发布一些代码，我希望它足够了。

（我用的是PUG templating engine，所以我的HTML是PUG风格的语法）

使用的依赖项：（在调试时分组以供概述）

doctype html
html
  head
    title= title

//- JQUERY
script(src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js')
//- JQUERY UI
link(rel='stylesheet', href='https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css')
script(src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js')
script(src='/javascripts/jquery-ui-1.8.16.custom.min.js')
//- Date range slider
script(src='/javascripts/jQDateRangeSlider-min.js')
//link(rel='stylesheet', href='/stylesheets/iThing-min.css')
link(rel='stylesheet', href='/stylesheets/classic-min.css')
//- BOOTSTRAP DATE PICKER
script(type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js")
link(rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css')   
//- BOOTSTRAP
script(src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js')
link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css')
//- BOOTSTRAP TOGGLE
link(href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet")
script(src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js")
//- custom CSS
link(rel='stylesheet', href='/stylesheets/style.css')
body
  block content

放在我的 HTML 表单中：

div.form-group
      label.control-label(for="myslider") where the slider?
      div#myslider

按照记录初始化滑块：

$("#myslider").dateRangeSlider();

结果：

希望这不会令人困惑 - 我无法发布整个内容。但是其他表单元素以这种方式工作（即 datepicker，其他表单输入） $("#myslider").dateRangeSlider() 函数被调用（我通过删除在控制台中引发错误的依赖项进行检查。）

我不知道如何进一步调试，如有必要，我很乐意提供更详细的信息。谢谢！

Answer 1

解决方案是将脚本标签与 $("#myslider").dateRangeSlider();在 div#myslider 之后。很大程度的尴尬。它现在按预期工作。