如何在<script>里修改flask传入html的变量?

web小白跪求指点~~~

通过flask视图函数中的render_template,我将一个变量传入了html,形式大概是:

return render_template('tb.html', datas=datas)

其中,data是一个list,每个元素是一个dict。
在html中,我根据datas的内容动态添加部件,即:

<div id="divadd">
    {%for item in datas%}
    {#根据item的key内容添加部件的代码#}
    {%endfor%}
    <button type="button" id="add">新增部件</button>
</div>

现在我想通过div中的新增部件,每点击一次可以在datas后追加一个元素,对应html上的部件也多一个。

我知道可以使用类似下面的方法实现:

<script type="text/javascript">
    $(function() {
        $('#add').click(function(){
            $('#divadd').append('<li>动态新增条目</li>');
        });
     });
</script>

但该方法我想要添加的部件部分相比<li>动态新增条目</li>要复杂得多,同时需要根据datas中对应元素的编号来动态生成,所以这样的方法并不适用。

目前的预期是,是否有某种方法,可以在<script>中修改datas,例如类似datas.append(#新元素)?如果不能直接修改datas,或能够修改datas但html不会重新渲染,那么我的想法应当如何实现?

待解决 悬赏分:50 - 离问题结束还有 543天14小时40分46秒
反对 0举报 0 收藏 0

我来回答

回答1