Python Flask 模板使用 {{}} 不能混合 javascript var

Python Flask templates use {{}} can't mix javascript var

本文关键字:不能 javascript var 混合 Flask Python      更新时间:2023-09-26

这是我的问题。PictureLenth 是我的图片数组长度,ProductImage 是一个列表。我现在不能使用将我的阵列地址指向产品图像。如何在 {{}} 上使用 javascript var?

lenth = {{ PictureLenth }}-1;
now = 0;
function t_setInterval() {
window.intervalParam = window.setInterval(function() {
var date = new Date();
   if (lenth>now)
   {now = now + 1;}
   else
   {now = 0;}
    var img = document.getElementById("image");
    img.src="data:image/png;base64, {{ ProductImage[now] }}";
    return false;
}, 4000);
}

这是因为Jinja在服务器端运行时没有任何now访问权限,当JavaScript在客户端运行时,字符串是静态的,永远不会改变。 解决方案是使用 Flask 的 tojson 过滤器将ProductImage作为 JavaScript 变量提供:

var images = {{ ProductImage | tojson | safe }},
    length = images.length - 1,
    now = 0;
function t_setInterval() {
  window.intervalParam = window.setInterval(function() {
    if (length > now) now = now + 1;
    else now = 0;
    var img = document.getElementById("image");
    img.src = "data:image/png;base64, " + images[now];
    return false;
  }, 4000);
}
lenth = {{ PictureLenth }}-1;
now = 0;
function t_setInterval() {
window.intervalParam = window.setInterval(function() {
var date = new Date();
   if (lenth>now)
   {now = now + 1;}
   else
   {now = 0;}
    var ProductImage = {{ProductImage|safe}};
    var img = document.getElementById("image");
    img.src="data:image/png;base64,"+ProductImage[now];
    return false;
}, 4000);
}