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需修改的部分

以上就是全部内容

相关推荐
忧郁的Mr.Li6 小时前
SpringBoot中实现多数据源配置
java·spring boot·后端
玄同7656 小时前
从 0 到 1:用 Python 开发 MCP 工具,让 AI 智能体拥有 “超能力”
开发语言·人工智能·python·agent·ai编程·mcp·trae
小瑞瑞acd6 小时前
【小瑞瑞精讲】卷积神经网络(CNN):从入门到精通,计算机如何“看”懂世界?
人工智能·python·深度学习·神经网络·机器学习
火车叼位6 小时前
也许你不需要创建.venv, 此规范使python脚本自备依赖
python
暮色妖娆丶6 小时前
SpringBoot 启动流程源码分析 ~ 它其实不复杂
spring boot·后端·spring
火车叼位6 小时前
脚本伪装:让 Python 与 Node.js 像原生 Shell 命令一样运行
运维·javascript·python
Coder_Boy_6 小时前
Deeplearning4j+ Spring Boot 电商用户复购预测案例中相关概念
java·人工智能·spring boot·后端·spring
孤狼warrior7 小时前
YOLO目标检测 一千字解析yolo最初的摸样 模型下载,数据集构建及模型训练代码
人工智能·python·深度学习·算法·yolo·目标检测·目标跟踪
Java后端的Ai之路7 小时前
【Spring全家桶】-一文弄懂Spring Cloud Gateway
java·后端·spring cloud·gateway
Katecat996637 小时前
YOLO11分割算法实现甲状腺超声病灶自动检测与定位_DWR方法应用
python