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

以上就是全部内容

相关推荐
吴佳浩3 小时前
Python入门指南(五) - 为什么选择 FastAPI?
后端·python·fastapi
寰天柚子3 小时前
Java并发编程中的线程安全问题与解决方案全解析
java·开发语言·python
GoGeekBaird3 小时前
分享几个使用Nano Banana Pro 画信息图的提示词
后端·github
shoubepatien3 小时前
JAVA -- 08
java·后端·intellij-idea
2503_928411563 小时前
项目中的一些问题(补充)
人工智能·python·tensorflow
yangminlei4 小时前
springboot pom.xml配置文件详细解析
java·spring boot·后端
superman超哥4 小时前
仓颉语言中锁的实现机制深度剖析与并发实践
c语言·开发语言·c++·python·仓颉
黄俊懿4 小时前
【深入理解SpringCloud微服务】Seata(AT模式)源码解析——全局事务的提交
java·后端·spring·spring cloud·微服务·架构·架构师
vv_Ⅸ4 小时前
打卡day42
python
白宇横流学长4 小时前
基于SpringBoot实现的历史馆藏系统设计与实现【源码+文档】
java·spring boot·后端