django中循环生成的多个btn,只有第一个btn会弹出模态框

django中循环生成的多个btn,只有第一个btn会弹出模态框

需求:为每个button按钮都绑定同一点击事件,点击每个btn都可弹出模态框

原因

  1. 问题代码
html 复制代码
<button id='btnDel' type="button" class="btn btn-primary btn-lg" > [删除] </button>

<script type="text/javascript">
	$(function (){
		bindBtnDelEvent();
	})
	function bindBtnDelEvent() {
		$("#btnDel").click(function () {
			// 点击id为btnDown的按钮,出现对应的模态框
			$('#myModal').modal('show');
		});
	}
</script>
  1. 在使用$('#btnDel')的方法寻找id,只能为第一个btn绑定点击事件,因为jQuery中通过$匹配标签id的方法默认仅寻找第一个。

解决方法

  1. 解决方法:为btn添加自定义class,通过寻找class的方式为每个button绑定同一个点击事件。如这里的"btnDel":
  2. 需要修改的代码
html 复制代码
<button type="button" class="btnDel btn btn-primary btn-lg" > [删除] </button>

$(".btnDel").click(function () { // js需修改的部分

以上就是全部内容

相关推荐
hhzz5 小时前
基于监控视频的水位尺自动识别技术方案与实现
python·opencv·yolo·图像识别·cv
yongche_shi5 小时前
ragas官方文档中文版(五十)
开发语言·python·ai·ragas·如何评估和改进 rag 应用
码事漫谈5 小时前
别写Prompt了,现在流行给AI“写循环”
后端
weixin_408099676 小时前
OCR批量识别图片方案:从手动处理到自动化API系统(Python/Java/PHP实战)
图像处理·python·ocr·文字识别·api调用·批量识别·石榴智能
Kyrie_Li6 小时前
Spring Boot Kafka 生产级配置全解析:从入门到精通
spring boot·后端·kafka
AI行业学习6 小时前
Notepad++ 官方下载 + 完整安装 + 全套优化配置(2026最新)
开发语言·人工智能·python·前端框架·html·notepad++
Coder_Shenshen7 小时前
西门子S7CommPlus协议鉴权算法原理与流程详解
网络·后端·算法
大圣编程7 小时前
Python中continue语句的用法是什么?
开发语言·前端·python
yuhaiqiang7 小时前
随手 vibecoding 的浏览器插件已经 6000 多次下载,聊聊他的产品设计
前端·后端·面试
云烟成雨TD7 小时前
LangFlow 1.x 系列【5】可视化编辑页面功能说明
人工智能·python·agent