问jQuery UI滑块不显示
EN

Stack Overflow用户

提问于 2012-03-20 16:56:42

回答 1查看 4.1K关注 0票数 0

我已经安装了jQuery UI滑块，但它不会显示在我的代码中。我看不出我做错了什么。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Home Page</title>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-ui-1.8.18.min.js" type="text/javascript"></script>
    <script src="/Scripts/modernizr-2.5.3.js" type="text/javascript"></script>

</head>
<body>
    <div class="page">
        <section id="main">
            <link href="/Content/themes/base/jquery.ui.slider.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">



    $(function () {
            ...
            $("#bwvolume").slider({
                value: 0,
                min: 0,
                max: 2500,
                step: 100,
                slide: function (event, ui) {
                    $("#spanbwvolume").val("$" + ui.value);
                }
            });
            $("#spanbwvolume").val("$" + $("#bwvolume").slider("value"));
        });
    </script>
   ...
        <tr class="format">
            <td width="150" valign="top" class="tdlabelNoSize">Volumes monochrome:</td>
            <td>
                <div id="bwvolume"></div>(<span id="spanbwvolume"></span>)
            </td>
        </tr>

     ...
</body>
</html>

浏览器中分配了一些空间。但是滑块没有显示。我的代码是基于http://jqueryui.com/demos/slider/#steps的。

这是我在FireBug中看到的：

<tr class="format">
<td class="tdlabelNoSize" width="150" valign="top">Volumes monochrome:</td>
<td>
<div id="bwvolume" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">slider=Object { element={...}, options={...}, _keySliding=false, meer...}
<a class="ui-slider-handle ui-state-default ui-corner-all" href="#" style="left: 0%;"></a>index.uiSliderHandle=0
</div>
(
<span id="spanbwvolume"></span>
)
</td>
</tr>

FireBug不会报告任何错误。

我是不是错过了图像之类的东西？在同一个页面上，我还使用了jQuery UI Selectable (代码中没有显示)，这运行得很好。

jquery-ui

uislider

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-03-20 17:23:57

您是否链接了JQuery UI css文件？

在我添加了jquery-ui.css并稍微修改了您的js代码之后，Slider出现了

请参阅http://jsfiddle.net/LGMHP/2/

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/9783795

复制

相似问题

问jQuery UI滑块不显示
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery UI滑块不显示EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery UI滑块不显示
EN