Javascript 使用函数设置html img元素的高度

我正在尝试使用Django设置加载到html文件中的图像的高度，如下所示：

<img data-original={{img.url}} width='310' height=calcHeight({{img.height}}, {{img.width}})/>

“calcHeight（h，w）”函数是一个简单的函数，用于按照310的宽度比例缩放图像的高度。我必须这样做，因为我使用了一个lazyloader插件，它需要在加载图像之前为图像生成空的占位符。图像的尺寸不同，因此我需要在加载实际图像之前获取图像的高度和宽度，否则在加载实际图像之前占位符将为“无高度”，从而导致在加载过程中布局混乱

---

上面的代码不起作用，我猜这是因为你不能调用这样的高度函数。我希望我解释的问题足够准确，并提前感谢任何提示

不能使用Django调用在模板中包含参数的函数。为了实现这一点，你需要

然后你可以做一些类似的事情：

{% my_img_tag img.url img.height img.width %}

在您的标记构造函数中会包含以下内容：

def my_img_tag(url, height, width):
    new_height = calcHeight(height, width)
    return {'url': url, 'height': new_height, 'width': width}

你可以这样做：

<img data-original="{{url}}" width="{{width}}" height="{{height}}"/>

---

我通过计算保存到django数据库的图像的缩放高度来解决此问题：

def save(self, *args, **kwargs):
    self.photo_scaledHeight = self.photo_height * (310/self.photo_width)
    super(Post, self).save(*args, **kwargs)

我将字段“photo_scaledHeight”添加到使用photo的模型中，这样我就可以在模板中简单地调用它，如下所示：

<img data-original={{photo.url}} width='310' height='{{photo_scaledHeight}}' />

---

@卢卡斯·拉扎罗为我指出了正确的方向

什么“不”起作用？是否有错误？抱歉，高度基本上设置为0，在加载网页时占位符没有高度。这会导致图像在滚动到视口后加载时溢出到其他图像/文本中。啊，因此在将图像上载到数据库时，基本上是在计算新高度，不是在加载网页时计算它？@dutchJSCOOP是否要计算出现在网页上而不是来自服务器的图像？Django模板是在服务器上呈现的，因此它不知道客户端上下文，如果是这种情况，也许使用javascript计算它可以达到预期的效果。不，我希望计算来自Django支持的服务器的图像高度。