html - jquery进度条不显示

Question

我想在我的网络应用程序中为我的投票结果设置一个进度条，我发现这篇关于 jquery 进度条的文章http://www.asp.net/ajaxlibrary/jquery_ui_mvc_progressbar.ashx但我的问题是进度条没有显示，这是我的代码：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/jscript">
    jQuery(document).ready(function () {
        jQuery("#progressbar").progressbar({ value: 37 });
    });
    </script>

这是我的进度条 div

    <div id="progressbar"></div>

知道我做错了什么吗？

编辑：我也用过这个，也没有工作

<script type="text/javascript">
$(document).ready(function() {
$("#progressbar").progressbar({ value: 37 });
});
</script>

Answer 1

确保jquery-ui.css在页面上正确加载了文件。否则它不会显示任何东西。这是我的问题。

Answer 2

仅使用上面的 jQuery 代码时，我也遇到了进度条不显示的问题。但是当我添加时出现了进度条

.ui-progressbar {
  height: 2em;
  text-align: left;
  overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
  margin: -1px;
  height: 100%;
  background-color: #ccc;
}

到我的 style.css 文件。显然，可以更改这些值以适合您的目的。

Answer 3

确保只加载一次 jquery。我在生成的代码中遇到了这个问题，其中加载了两个版本的 jquery。