Question

我一直在尝试创建一个网页，在收到用户输入后，它会在按下提交后显示所有用户输入的历史记录，但这是按预期工作的。但是，我想实现一个警告框，显示其他信息。但是，由于其他所有内容都正确打印，因为警报框使用onclick事件，它只会输出最后一个用户输入样本。

<!doctype html>
<html>
<head>
    <title>Enrolment page</title>
</head>
<body>
    {% if all_users %}
        {% for user in all_users %}
            <h1> Hi, {{ user[0] }}) </h1>
            <button onclick="myFunction()">Details</button>
            <script>
                function myFunction() {
                    alert("{{ user[1] }}, {{ user[2] }}");
                }
            </script>
        {% endfor %}
    {%else%}
        No users to show
    {% endif %}
</body>
</html>

在我的代码中，all_users是来自csv文件的信息，但是工作正常。我唯一的问题是警报没有显示我想要的信息。有没有办法在每个脚本中存储每组用户详细信息以打印出每个按钮，因为它只显示最后一组用户详细信息。

Answer 1

您可以在user[0]电话中绑定user[1]和myFunction()，例如：

{% for user in all_users %}
    <h1> Hi, {{ user[0] }}) </h1>
    <button onclick="myFunction('{{user[1]}}, {{user[2]}}')">
        Detail
    </button>
{% endfor %}

然后将功能更改为：

function myFunction(users) {
      alert(users);
}

Answer 2

要在Jinja2中使用它，您可以尝试使用字符串变量并将每个值附加到（代码未测试）中：

<!doctype html>
<html>
<head>
    <title>Enrolment page</title>
</head>
<body>
    {% if all_users %}
        {% set AllUserList = "" %}
        {% for user in all_users %}
            {% set AllUserList = AllUserList + user[1] + ", " + user[2] + "\n" %}
            <h1> Hi, {{ user[0] }}) </h1>
            <button onclick="myFunction()">Details</button>
            <script>
                function myFunction() {
                    alert("{{ AllUserList }}");
                }
            </script>
        {% endfor %}
    {%else%}
        No users to show
    {% endif %}
</body>
</html>

使用带有javascript警报的Jinja2 for循环

2 个答案: