访问 django for 循环中的元素

2024-06-11

我有一个 Django 模板,其中包含以下代码,该模板创建多个按钮并尝试通过单击(在同一按钮上)删除/隐藏其中一个按钮:

{% for h in helicopters %}
    <div class="btn-group" id="remove-heli">
        <button type="button" class="btn btn-default" onclick='my_func("{{ h }}")'>
            {{ h }}
        </button>
    </div>
{% endfor %}

where helicopters是一个字符串列表,稍后在脚本块中我有

function my_func(h) {
    document.getElementById('remove-heli').style.visibility = 'hidden';
    }

该函数运行,但正如您所期望的,它仅在我的 for 循环的第一个元素上运行,因为所有<\div>for循环中的元素具有相同的id。

我的问题是:有没有办法指向特定元素?或者,是否有更好的方法来打印彼此相邻的按钮?


为div元素设置不同的id怎么样?

{% for h in helicopters %}
    <div class="btn-group" id="remove-heli-{{ h }}">
        <button type="button" class="btn btn-default" onclick='my_func("{{ h }}")'>
            {{ h }}
        </button>
    </div>
{% endfor %}

然后,您可以使用 id 访问特定的 div 元素。

function my_func(h) {
    document.getElementById('remove-heli-' + h).style.visibility = 'hidden';
}

NOTE

对多个元素使用相同的 ID 并不是一个好主意。使用唯一的 ID。

UPDATE

或者,您可以使用forloop.counter https://docs.djangoproject.com/en/1.8/ref/templates/builtins/#for:

{% for h in helicopters %}
    <div class="btn-group" id="remove-heli-{{ forloop.counter }}">
        <button type="button" class="btn btn-default" onclick='my_func("{{ h }}")'>
            {{ h }}
        </button>
    </div>
{% endfor %}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

访问 django for 循环中的元素 的相关文章

随机推荐

  • rspec 在需要存根的私有方法中测试私有方法

    Simplecov 检测到我遗漏了一些测试lib api verson rb class class ApiVersion def initialize version version version end def matches req
  • 整个程序可以是不可变的吗? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我熟悉不可变性并且可以设计不可变类 但我主要拥有学术知识 缺乏实践经验 请参考上面的链接图片 尚不允许嵌入 从下往上看 学生需要新地址
  • Linux find 命令权限被拒绝

    我想过滤掉不必要的信息 权限被拒绝 这些是命令 的输出find type f name sources list find run lxcfs Permission denied find run sudo Permission denie
  • R 脚本 - 如何在错误时继续执行代码

    我编写了一个 R 脚本 其中包含一个检索外部 Web 数据的循环 数据的格式大多数时候是相同的 但有时格式会以不可预测的方式发生变化 并且我的循环崩溃 停止运行 有没有办法不管错误如何继续执行代码 我正在寻找类似于 VBA 中的 On er
  • Apache Zeppelin 安装 grunt 构建错误

    我的配置如下 Ubuntu 15 04 Java 1 7 Spark 1 4 1 Hadoop 2 7 Maven 3 3 3 我正在尝试从 github 成功克隆 Apache Zeppelin 并使用以下命令后安装它 mvn clean
  • ASP.NET 中的 ThreadStaticAttribute

    我有一个需要存储的组件static每个线程的值 它是一个通用组件 可以在许多场景中使用 而不仅仅是在 ASP NET 中 我想用 ThreadStatic 属性来实现我的目标 假设它在 ASP NET 场景中也能正常工作 因为我假设每个请求
  • 构建 AOSP 5.1 时出现 API 更改错误

    目前正在尝试构建 android 5 1 0 r5 我已经检查了来源并且没有做任何修改 但是 编译时出现以下错误 Checking API checkpublicapi current out target common obj PACKA
  • sed 将带空格的行插入到特定行

    我在开头有一行空格 例如 Hello world 我想将此行插入到文件中的特定行 例如 将 hello world 插入下一个文件 hello world result hello hello world world 我正在使用这个 sed
  • 在 C++ 中,将 float 转换为 double 再转换回 float 是否给出相同的值

    假设在下面的代码中 float f1 double d1 static cast
  • 如何在 Ubuntu x64 中使用 ptrace 插入 int3?

    我正在努力追随本指南 http eli thegreenplace net 2011 01 27 how debuggers work part 2 breakpoints 通过设置断点达到相同的结果 唯一的区别是我在 x64 系统上 所以
  • 致命:Jenkins IIS ID 无效

    我正在尝试设置 Jenkins 从 bitbucket 中提取并构建一个项目 我在 IIS 8 5 Server 2012 r2 上使用它 我已经设置了 Git 和 Bitbucket 插件 我已经建立了一个包含以下内容的项目 Branch
  • 404 路由无法匹配请求的 URL

    我刚刚开始学习zend 框架 questions tagged zend framework并遵循此用户指南 http framework zend com manual 2 3 en index html 我能够成功安装zend skel
  • create() 时不会调用观察者

    我有一个Ember Mixin它观察到它的属性之一 这里bar baz 我扩展了这个 Mixin 并设置了bar baz in the create 参数 但我的观察者没有被调用 这是我的代码 App FooMixin Ember Mixi
  • Google Maps JavaScript API v3 方向功能

    我使用 Google Maps js API v3 我可以根据路径点显示方向this http code google com intl hu apis maps documentation directions Waypoints 我想要
  • MSBuild 找不到 resgen.exe

    我有一台 VM 机器 我在其中复制了 SDK 文件和路径 转到注册表并将密钥添加到注册表中 但我不断收到错误 resgen exe找不到 C Windows Microsoft NET Framework v4 0 30319 Micros
  • JSF 1.2:如何在同一视图上的回发中保持请求范围的托管 bean 处于活动状态?

    是否可以在同一页面上的回发过程中保持请求作用域的 bean 处于活动状态 一般的问题是 bean 在请求结束时被丢弃 并在每次表单提交时重新创建 例如动态操作背后的布尔值disabled readonly and rendered重置为默认
  • CROSS APPLY WHERE 子句在交叉应用之前或结果之后起作用吗

    我正在做一种我们在一个内部应用程序中需要的自定义模糊匹配算法 我正在努力加快速度 当我对模糊函数进行交叉应用以查找建议的匹配项时 我不想搜索不必要的数据 这是函数 select top 5 Manufacturer Manufacturer
  • 未终止的字符串文字

    我有一个 php 脚本 可以在我的服务器上上传 mp3 文件 我使用 上传 有一个事件 onSelect 文档 http www uploadify com documentation events onselect 当文件上传时调用 使用
  • Ruby/Rails/Rack 代码中的“use”关键字/单词

    最近我偶然在Ruby代码中看到这个词 use 当我正在查看一些与goliath https github com postrank labs goliath 中间件等 看起来它不同于include extend and require 有人
  • 访问 django for 循环中的元素

    我有一个 Django 模板 其中包含以下代码 该模板创建多个按钮并尝试通过单击 在同一按钮上 删除 隐藏其中一个按钮 for h in helicopters div class btn group div