Django中{%for%}需要注意的细节

最新推荐文章于 2024-04-28 11:35:41 发布
最新推荐文章于 2024-04-28 11:35:41 发布
阅读量829 收藏
点赞数
分类专栏： Django 文章标签： django python 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44833392/article/details/123385466
版权

文章目录

题目

Django中for循环需要注意的细节

问题

  • 在{%for%}循环中添加onclick()函数往往会指向最后一个item，而不是指向其相对应的item

test_base.html

<!--
 * @Description: test_base.html
 * @Autor: 365JHWZGo
 * @Date: 2022-02-15 18:12:33
 * @LastEditors: 365JHWZGo
 * @LastEditTime: 2022-03-09 11:38:38
-->

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>测试页面</title>
</head>

<body>
    {% block content %} {% endblock content %}
</body>

</html>

test.html

<!--
 * @Description: 测试for循环模版
 * @Autor: 365JHWZGo
 * @Date: 2022-02-15 17:01:24
 * @LastEditors: 365JHWZGo
 * @LastEditTime: 2022-03-09 19:43:28
-->
{% extends "test_base.html" %} {% block content %}
<table class="content">
    <th>
        <td>用户id</td>
        <td>姓名</td>
        <td>性别</td>
        <td>出生日期</td>
    </th>
    {% for item in user %}
    <tr>
        <td>{{item.id}}
            <a onclick="getId()" style="background-color: orange; cursor: pointer;">点击我获取id</a>
        </td>
        <td>{{item.username}}</td>
        <td>{{item.sex}}</td>
        <td>{{item.birthday}}</td>
    </tr>
    <script>
        console.log('item.id=', '{{item.id}}');

        function getId() {
            console.log('func getId->item.id=', '{{ item.id}}');
        }
    </script>
    {% endfor %}
</table>
<script src="https://cdn.bootcss.com/jquery/2.1.2/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
{% endblock content %}

在这里插入图片描述
此时在控制台输出的是
在这里插入图片描述
当点击第一项是即id=1，此时控制台的输出为
在这里插入图片描述
此时你会发现无论点击哪一个都会显示item.id=6

这是因为script总是在css、html加载完成后才会调用，这样导致在for循环中的getId()函数无法判别到底是调用的是哪一个。

为了进一步发现问题，我们打开
在这里插入图片描述


    <tr>
        <td>1
            <a onclick="getId()" style="background-color: orange; cursor: pointer;">点击我获取id</a>
        </td>
        <td>user132</td>
        <td>女</td>
        <td>1970-1-1</td>
    </tr>
    <script>
        console.log('item.id=', '1');

        function getId() {
            console.log('func getId->item.id=', '1');
        }
    </script>
    
  
   ····
    
    <tr>
        <td>5
            <a onclick="getId()" style="background-color: orange; cursor: pointer;">点击我获取id</a>
        </td>
        <td>user11111</td>
        <td>女</td>
        <td>1990-3-21</td>
    </tr>
    <script>
        console.log('item.id=', '5');

        function getId() {
            console.log('func getId->item.id=', '5');
        }
    </script>
    
    <tr>
        <td>6
            <a onclick="getId()" style="background-color: orange; cursor: pointer;">点击我获取id</a>
        </td>
        <td>青山威廉</td>
        <td>男</td>
        <td>2000-5-6</td>
    </tr>
    <script>
        console.log('item.id=', '6');

        function getId() {
            console.log('func getId->item.id=', '6');
        }
    </script>

由此可以知道大家都是调用的getId()，所以电脑识别的话无法分清楚到底谁是谁。因此我们解决的前提就是要给它们一个"特定的id"号。

我的解决方案

<!--
 * @Description: 测试模版继承页面
 * @Autor: 365JHWZGo
 * @Date: 2022-02-15 17:01:24
 * @LastEditors: 365JHWZGo
 * @LastEditTime: 2022-03-09 20:03:43
-->
{% extends "test_base.html" %} {% block content %}
<table class="content">
    <th>
        <td>用户id</td>
        <td>姓名</td>
        <td>性别</td>
        <td>出生日期</td>
    </th>
    {% for item in user %}
    <tr>
        <td>{{item.id}}
            <a onclick="getId(this)" alt="{{item.id}}" style="background-color: orange; cursor: pointer;">点击我获取id</a>
        </td>
        <td>{{item.username}}</td>
        <td>{{item.sex}}</td>
        <td>{{item.birthday}}</td>
    </tr>
    {% endfor %}
</table>
<script src="https://cdn.bootcss.com/jquery/2.1.2/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script>
    function getId(a) {
        console.log('func getId->item.id=', $(a).attr('alt'));
    }
</script>
{% endblock content %}

最重要的是这里！！！使用this特殊指向该item，获取alt属性里的id

function getId(a) {
   console.log('func getId->item.id=', $(a).attr('alt'));
}

这样就可以获取到对应的id了
在这里插入图片描述

365JHWZGo
关注
专栏目录
django中for循环的使用
elevenqiao的专栏
08-25 1万+
{% for %} 允许我们在一个序列上迭代。与Python的for 语句的情形类似，循环语法是 for X in Y ，Y是要迭代的序列 而X是在每一个特定的循环中使用的变量名称。每一次循环中，模板系统会渲染在{% for %} and {% endfor %} 中的所有内
DJango 中 {% for %}解释
Michael_Lbs的博客
03-24 601
转载：出处
django模板标签{% for %}的使用（含forloop用法）
李谦的博客
12-27 3万+
在django模板标签中，{% for %} 标签用于迭代序列中的各个元素。 与 Python 的 for 语句类似,语法是 for X in Y ,其中 Y 是要迭代的序列, X 是单次循环中使用的变量。每次迭代时,模板系统会渲染 {% for %} 和 {% endfor %} 之间的内容。1. 可以使用下述模板显示 athlete_list 变量中的运动员:<ul>
for
rainyrice的博客
05-15 320
变量 描述 forloop.counter 索引从 1 开始算 forloop.counter0 索引从 0 开始算 forloop.revcounter 索引从最大长度到 1 forloop.revcounter0 索引从最大长度到 0 forloop.first 当遍历的元素为第一
Django 添加ldap认证细节注意
cuijianzhe
01-06 789
项目地址 https://github.com/etianen/django-python3-ldap LDAP django_python3_ldap 如果不添加cn查找用户会出现同步时出现如下报错： LDAP bind failed: LDAPInvalidCredentialsResult - 49 - invalidCredentials - None - None - bindResponse - None CommandError: Could not connect to LDAP serv
Django自关联实现多级联动查询实例
09-16
这里有几个重要的细节需要注意： - `address`: 用于存储具体的地址名称，比如省份名或城市名。 - `pid`: 作为外键，关联到 `AddressInfo` 自身，用于表示层级关系。 - `null=True` 和 `blank=True` 表示这个字段...
Django用户登录与注册系统
热门推荐
laikaikai的博客
06-04 11万+
1.1.创建项目和appdjango-admin startproject mysite_login python manage.py startapp login1.2.设置时区和语言Django默认使用美国时间和英语，在项目的settings文件中，如下所示：LANGUAGE_CODE = 'en-us' TIME_ZONE = 'UTC' USE_I18N = True USE_L1...
Django添加js
头头的博客
01-07 1万+
我们之前完整的搭建了一个app，同时能够使数据库中的数据在前台页面中显示出来。那么，我们如何将用户在前台页面中的操作返回给后台呢？这篇文章展示一个demo在Django搭建第一个应用 的基础上，我们继续。引入js库我们写页面很多时候需要外部js库的支持，那么这些文件应该放在哪里呢？又该如何配置呢？ 建立static文件夹： 注意上图里面static文件夹的路径，再在里面添加js文件夹，js文
Django框架
Pwsifeng的博客
12-03 2477
Django框架
Django模板标签{% for %}以及forloop的使用
Leeyongbard的博客
12-30 9246
在Django模板标签中,{% for %}的主要作用就是用来迭代序列中的各个元素与Python中for语句的使用类似，可以迭代列表，元组，字典等 1.使用下面模板标签显示book_list变量中的书籍（如图所示）： 2.同样，{% for %}模板标签也可使用reversed反向迭代列表 3.判断是否为空，如果为空则显示特定内容： 第一种方法（使用 {% if %
DJANGO for wizard
Gavin
03-16 878
仅以此文，献给WuLuoStudio的各位wizard:)。 1 django 是框架，框架是什么？ 在了解框架的概念之前，我们来看看客户端浏览器请求到显示网页内容这个过程，如下： 由上图，如果没有框架的话，数据查询、生成html、数据返回三个过程我们都需要利用相应的较为底层的API去实现，而且后台cgi程序的软件架构也得自己去实现。但是框架给了我们更加方便的接口和
Django for标签详解
ccc369639963的博客
05-19 523
Django for标签详解 1. for标签的使用 for 标签用于对可迭代对象进行遍历，包括列表、元组等，它与 Python 中的 for 语法是类似的。for 标签 使用时也需要和 endfor 标签配合使用，当然它也有不同之处，那就是它多了一个可选的 empty 标签，比如用它来显示当列表不存在或者列表中元素为空的时候要显示的内容，它的使用格式如下： {% for 变量 in 可迭代对象 %} ... 循环语句 {% empty %} ... 可迭代对象无数据时填充的语句 {% en
django中for的用法
09-18 1570
Django是怎么处理请求的 所有均开始于setting文件。当你运行python manage.py runserver，脚本将在于manage.py同一个目录下查找名为setting.py的文件。这个文件包含了所有有关这个Django项目的配置信息，均大写： TEMPLAT
13.Django中几大常用模板标签讲解及实战使用 【for循环；if判断；页面跳转；开启关闭自动转义；url携带参数传递；注释】
孤寒者的博客
08-23 1万+
1.常用模板标签 （1）模板标签重要概念: ①定义：标签在渲染的过程中提供任意的逻辑。 ②标签语法: 由 {% 和 %} 来定义的，例如：{%tag%} {%endtag%}   （2）常用模板标签讲解及实战使用： 第一个——模板标签中的for循环！ 引言：假设我们现在有个需求是——后端视图函数从数据库中获取了需要渲染在前端页面的数组（为一个列表类型的数据）。   我们如何一条条渲染显示在前端页面中，类似于报纸上那种！     这就可以用到模板标签中的——for循环简单模拟实现！ ①视图函数views.
【Python】【进阶篇】25、Django for标签详解
deepboat的博客
05-08 1017
【Python】【进阶篇】25、Django for标签详解
DTL语言学习（二）{% for %}标签的使用
xujin0的博客
10-25 1534
首先新建一个测试项目，然后新建一个for_demo的app，在app中新建一个urls.py文件，在新建一个templates的文件夹。里面新建一个for.html的文件，然后将app添加至settings.py文件中，然后配置好一切路径，在for_demo中的views.py中渲染模板for.html，这些都配置成功后，我们就可以进行{% for %}标签的学习了。 在views.py中编写代码...
实现动态封禁 IP，干死爬虫
最新发布
m0_57472099的博客
04-28 350
我们在看视频学习的时候，不能光动眼动脑不动手，比较科学的学习方法是在理解之后运用它们，这时候练手项目就很适合了，只是里面的项目比较多，水平也是参差不齐，大家可以挑自己能做的项目去练练。这是我花了几天的时间去把Python所有方向的技术点做的整理，形成各个领域的知识点汇总，它的用处就在于，你可以按照上面的知识点去找对应的学习资源，保证自己学得较为全面。完成以上步骤后，重新加载 nginx，配置便开始生效了。3、动态配置，可以手工或者通过某种自动化的方式设置 Redis 中的黑名单。Nginx 配置，其中。
html5只能django来写if吗,（4）Django学习——模板标签定义及语法：for循环，if判断，页面跳转，开启关闭自动转义，ur...
weixin_35606595的博客
06-25 195
1.常用标签(1)模板标签重要概念:1.定义：标签在渲染的过程中提供任意的逻辑注意：(这个定义是刻意模糊的。 例如，一个标签可以输出内容，作为控制结构，例如“if”语句或“for”循环从数据库中提取内容，甚至可以访问其他的模板标签。)2.标签语法: 由 {% 和 %} 来定义的，例如：{%tag%} {%endtag%}(2)常用模板标签讲解及使用：1.模板标签中的for循环：①music应用下的...
django {% csrf_token %}
05-16
Django中的CSRF（Cross Site Request Forgery）是一种攻击方式，攻击者利用用户已登录的状态，伪造用户的请求，从而执行一些恶意操作。为了防止这种攻击，Django提供了CSRF保护机制。 在Django中，使用{% csrf_token %}标签可以生成一个随机的CSRF令牌。这个令牌会在提交表单时一起提交给服务器，服务器会验证这个令牌是否与用户登录信息匹配，如果不匹配，则认为这是一次恶意请求，服务器会拒绝执行该请求。 使用{% csrf_token %}标签很简单，只需要在表单中添加该标签即可： ``` <form method="post"> {% csrf_token %} <!-- 其他表单元素 --> <button type="submit">提交</button> </form> ``` 在提交表单时，Django会自动将CSRF令牌添加到表单数据中，并在服务器端验证令牌的有效性。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

365JHWZGo

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值