JQuery UI滑块，仅加载Button而不加载Range并且滑块不滑动
Posted
技术标签:
【中文标题】JQuery UI滑块，仅加载Button而不加载Range并且滑块不滑动【英文标题】：JQuery UI slider, only the Button loads and not the Range and the slider does not slide 【发布时间】：2021-11-02 23:02:18 【问题描述】：我正在使用 jquery 滑块，我面临的问题是只显示滑块按钮而不是范围。当我尝试滑动按钮时，它不会滑动。
<div id="slider-range"></div>
JS
$("#slider-range").slider(
range: true,
min: 0,
max: 500,
values: [75, 300],
slide: function (event, ui)
console.log("sliding");
);
这就是 UI 出现的方式
注意事项：
-
我确认 div 在执行 JS 之前已经加载完毕，并且控制台中没有异常。
为了确认 JQuery UI JS 和 CSS 的加载，我在同一个 Div 中渲染了一个不同的控件（Calendar Control），它加载并正常工作。
我实现了滑块回调以确认控件从 JQueryUI 工作，并且滑块回调正常工作。我可以看到我在回调中放入的控制台日志。
我通过控制台中的 Elements 选项卡确认 Div 已附加 JQueryUI 类
我观察到滑块按钮添加了一个 href 属性，它指向 localhost。
我还确认通过控制台我可以看到滑块按钮上应用的 jquery-UI 样式
如果有人能帮助我解决这个问题，那将非常有帮助。
【问题讨论】：
您是否将呼叫包装在 document.ready 中？即使您建议没有操作顺序问题，也可能会有所帮助 欢迎来到 Stack Overflow。这些图像表明您没有包含 jQuery 的 CSS。请提供一个最小的、可重现的示例：***.com/help/minimal-reproducible-example 你没有必要的依赖..... @nikhilsugandh：如果您能建议缺少的依赖项，这将非常有帮助 @Ctznkane525：我没有将它包装在 document.ready 中，但我在添加 JS 控件的代码和文档可用之前通过控制台确认了相同的内容，甚至是我添加的 div也可以进行控制。此外，通过检查元素，我确认 div 已附加控件的元素 【参考方案1】：使用这个：
https://jsfiddle.net/6sxg9ytd/1/
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Slider - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.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" ).slider(
range: true,
min: 0,
max: 500,
values: [ 55, 105 ],
slide: function( event, ui )
console.log("sliding");
);
);
</script>
</head>
<body>
<div id="slider"></div>
</body>
</html>
【讨论】：
这段代码类似于 jqueryui.com 上的代码。我已经尝试过了，但它不起作用。另外，您能否解释一下 demo/style.css 的用途以及它如何为您工作。据我了解，这是 jquiryui 页面所需的。由于您使用的是不同的环境，它是否解决了任何目的 @RishabhNigam 检查小提琴jsfiddle.net/6sxg9ytd/1 它的工作原理......你可以用绿色勾号来回答...... @RishabhNigam 你可以给它一个绿色勾号。检查答案中的小提琴链接以上是关于JQuery UI滑块，仅加载Button而不加载Range并且滑块不滑动的主要内容，如果未能解决你的问题，请参考以下文章