Flask+Ajax后的死CSS/JS

Question

我之所以开始这个问题，是因为前面一个问题：Dynamically update HTML images from Flask+Ajax。重新总结后，我需要在响应后更新HTML视图，这要归功于来自Flask入口点的AJAX。

<ul>
    {% for image in list%}
    <li>
       <img src="{{image}}" height="150" width="150"></img>
    </li>
    {% endfor %}
</ul>

AJAX函数

$.ajax({
        url: "/...",
        type: "POST",
        dataType: 'json',
        data: {...},
        success: function(resp){
            $("ul").children().remove();
            for (var i = 0; i < resp.length; i++) {
                var elem = "<li><img src=" + resp[i] + "></li>";
                $("ul").append(elem);
            }
        }
    });

问题是，在我更新视图之后，按照与“原始”HTML相同的结构，所有链接到与Jquery (标记)相结合的图像的CSS都不再工作了(比如悬浮效果，ecc.)。

有没有人有建议，或者建议另一种工作方式来完成任务？

Answer 1

我认为这个答案可能有助于解决你的问题，看看：https://stackoverflow.com/a/17715303/11388121。

实际上，这是因为在AJAX函数之后注入的HTML不是在页面加载时执行的“原始”HTML。因此，您可能需要一些事件委托。