Question

以下2个js函数可以在禁用类之间切换按钮。我希望禁用状态依赖于python代码中的全局变量filelength，但不能想到一个简单的方法。我能想到的唯一方法是拥有2个相同但独立的模板，一个禁用按钮，另一个启用。

<script type="text/javascript" language="JavaScript">
     function enableButton(button){
     document.getElementById(button).removeAttribute('class');
         document.getElementById(button).setAttribute("class", "button");
     }
     function disableButton(button){
         document.getElementById(button).setAttribute("class", "disabled");
     }
   </script>

我打算使用以下index.html模板元素的函数。

<button id="Test" class="button disabled" >
Test
</button>

预期的切换会生成以下alt.html模板元素，该元素忽略了“已禁用”。

<button id="Test" class="button" >
Test
</button>

要求两个单独的模板（index.html和alt.html）来完成此切换似乎很愚蠢，但我想不出允许我只改变index.html的替代方案。最初我认为jinja2会提供所需的功能，但这似乎不正确。

如果没有使用python和GAE的第二个模板，我怎样才能实现这个目标？

为了更完整，下面我将展示我的python应用程序的相关状态。

import os
import jinja2
import webapp2
import urllib

filelength = 0

class MainPage(BaseHandler):

    def get(self):
    global filelength
    logging.info("text length in Main get: %s " % filelength)
    template_values = {'filelength':filelength}
        template = JINJA_ENVIRONMENT.get_template('index.html')
        self.response.out.write(template.render(template_values))

    def post(self):
    global filelength
    url = self.request.get('URL', None)
    text = urllib.urlopen(url).read()
    logging.info("text length in Main post: %s " % len(text))
    filelength = len(text)
    if filelength > 0:
        return webapp2.redirect('/alt')
    else:
        return webapp2.redirect('/')

class AltMainPage(BaseHandler):

    def get(self):
    global filelength
    logging.info("text length in Alt get: %s " % filelength)
    template_values = {'filelength':filelength}
        template = JINJA_ENVIRONMENT.get_template('alt.html')
        self.response.out.write(template.render(template_values))

    def post(self):
    global filelength
    url = self.request.get('URL', None)
    text = urllib.urlopen(url).read()
    logging.info("text length in Alt post: %s " % len(text))
    if filelength > 0:
        return webapp2.redirect('/alt')
    else:
        return webapp2.redirect('/')
    return webapp2.redirect('/')

app = webapp2.WSGIApplication([
        ('/', MainPage), 
        ('/alt', AltMainPage), 
        ],
        debug=True)

Answer 1

在模板index.html中，只需使用jinja2定义类属性，其中buttonclass的值在python中定义为button或button disabled使用“ if ... else“construct。

<button id="Test" class="{{ buttonclass }} " >
Test
</button>

触发基于python变量值的javascript函数

1 个答案: