Question

由于某种原因，进度栏无法正常工作。

这是HTML，CSS和JS：

<html>
    <head>
        <link href="css/style.css" rel="stylesheet">
        <script src="js/app.js" type="text/javascript"></script>
        <script src="nui://game/ui/jquery.js" type="text/javascript"></script>
    </head>

    <body>
        <div class="bar-one bar-con">
        <div class="bar" data-percent="20"></div>
    </div>

  <div class="bar-two bar-con">
    <div class="bar" data-percent="50"></div>
  </div>

  <div class="bar-three bar-con">
    <div class="bar" data-percent="70"></div>
  </div>
        <script src="js/app.js" type="text/javascript"></script>
    </body>
</html>

其余的代码在链接中，我仍在学习使用页面（千个歉意）：

https://jsfiddle.net/b4kqt1cz/

Answer 1

您的问题似乎是未加载jQuery，因此对$.fn.progress()的调用（实际上是进度条的实际更新）无法正常工作。可以在浏览器的控制台中进行验证（通常通过按 F12 来找到），您可以在其中找到以下错误：

未捕获的ReferenceError：未定义jQuery
在window.onload

如果可能的话，您应该使用jQuery CDN链接之一或下载jQuery副本并将其放置在<head>文件夹中来更新js中对jQuery的引用并从那里引用它。

更新后的JS Fiddle（将对JQuery的引用更改为版本1.12.4的CDN链接）按预期工作。

进度条不显示进度

1 个答案: