Javascript 使用Python CherryPy在加载时调用JQuery_Javascript_Jquery_Python_Cherrypy

Javascript 使用Python CherryPy在加载时调用JQuery

javascript jquery python

Javascript 使用Python CherryPy在加载时调用JQuery,javascript,jquery,python,cherrypy,Javascript,Jquery,Python,Cherrypy,我有下面的JQuery函数，我希望在页面加载时调用它 class Fitbit(object): @cherrypy.expose def index(self): currentDate = (time.strftime("%d/%m/%Y")) return """<html> <head> <title>Fitbit</title> <link href="/static/cs

我有下面的JQuery函数，我希望在页面加载时调用它

class Fitbit(object):
@cherrypy.expose
def index(self):

    currentDate = (time.strftime("%d/%m/%Y"))

    return """<html>
    <head>
        <title>Fitbit</title>
        <link href="/static/css/fitbit.css" rel="stylesheet">
        <script>
           $(document).ready(function(){
               $('.bar-percentage[data-percentage]').each(function () {
          var progress = $(this);
          var percentage = Math.ceil($(this).attr('data-percentage'));
          $({countNum: 0}).animate({countNum: percentage}, {
            duration: 2000,
            easing:'linear',
            step: function() {
              // What todo on every count
            var pct = '';
            if(percentage == 0){
              pct = Math.floor(this.countNum) + '%';
            }else{
              pct = Math.floor(this.countNum+1) + '%';
            }
            progress.text(pct) && progress.siblings().children().css('width',pct);
            }
          });
        });
        });

        </script>
    </head>

    <body>

    <h4>{0}</h4>

                <article class="infoWindow">
                    <article class="infoLogo"><img alt="backDate" src="/static/images/footprint.png" width="40" height="40"/>Steps</article>
                    <div id="bar-1" class="bar-main-container azure">
                        <div class="wrap">
                            <div class="bar-percentage" data-percentage="38"></div>
                            <div class="bar-container">
                            <div class="bar"></div>
                        </div>
                    </div>
                  </div>
                </article>
    </body>

    </html>""" .format(currentDate)

    #return html
    index.exposed = True

if __name__ == '__main__':
 conf = {
 '/': {
     'tools.sessions.on': True,
     'tools.staticdir.root': os.path.abspath(os.getcwd())
 },
 '/static': {
     'tools.staticdir.on': True,
     'tools.staticdir.dir': './public'
 },
 '/images': {'tools.staticdir.on': True,
    'tools.staticdir.dir': './public'}
 }
 cherrypy.quickstart(Fitbit(), '/', conf)

类Fitbit（对象）：
@樱桃树
def索引（自）：
currentDate=（time.strftime（“%d/%m/%Y”））
返回“”
菲比特
$（文档）.ready（函数（）{
$（'.bar百分比[数据百分比]）。每个（函数（）{
var progress=$（此项）；
var percentage=Math.ceil（$（this.attr（'data-percentage'））；
$（{countNum:0}）.animate（{countNum:percentage}{
期限：2000年，
放松：'线性'，
步骤：函数（）{
//每件事都该怎么办
var pct=''；
如果（百分比==0）{
pct=Math.floor（this.countNum）+'%'；
}否则{
pct=Math.floor（this.countNum+1）+'%'；
}
progress.text（pct）和&progress.sides（）.children（）.css（'width'，pct）；
}
});
});
});
{0}
台阶
“”格式（当前日期）
#返回html
index.exposed=True
如果uuuu name uuuuuu='\uuuuuuu main\uuuuuuu'：
形态={
'/': {
'tools.sessions.on'：True，
'tools.staticdir.root'：os.path.abspath（os.getcwd（））
},
“/static”：{
'tools.staticdir.on'：True，
'tools.staticdir.dir'：'/public'
},
“/images'：{'tools.staticdir.on'：True，
'tools.staticdir.dir'：'/public'}
}
快速启动（Fitbit（），“/”，conf）

这是在我的HTML中，在.py文件中使用

return”“”

等。

我正在使用CherryPy来实现这一点，我需要找到如何在页面加载时调用此函数。我找到的所有示例都是在单击按钮时调用的，这对我没有任何帮助，尤其是因为我是新手，不知道如何在加载时执行类似操作。谢谢

这将在就绪时调用init

$('document').ready(init);
        function init(){
            $('.bar-percentage[data-percentage]').each(function () {
            var progress = $(this);
            var percentage = Math.ceil($(this).attr('data-percentage'));
            $({countNum: 0}).animate({countNum: percentage}, {
                duration: 2000,
                easing:'linear',
                step: function() {
                // What todo on every count
                    var pct = '';
                    if(percentage == 0){
                        pct = Math.floor(this.countNum) + '%';
                    }else{
                        pct = Math.floor(this.countNum+1) + '%';
                    }
                progress.text(pct) && progress.siblings().children().css('width',pct);
                }
            });
        });
    };

希望这能有所帮助！

在上面添加了更多代码，以防在运行上面的代码时出现关键错误，但在运行上面的代码时仍然没有运行，只是在应该显示的信息处空白。啊，破解了它，我忘记了“谢谢！”）