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

以上就是全部内容

相关推荐
jay神23 分钟前
【计算机毕业设计】基于SpringBoot的程序教学辅助系统
java·前端·vue.js·spring boot·后端·毕业设计·课程设计
lupai1 小时前
手机在网状态接口实测效果与质量评估
大数据·python·智能手机·api接口
荷蒲2 小时前
【小白量化Qbuddy】用AI设计miniQMT指标公式计算量化平台
人工智能·python·机器人
阿童木写作2 小时前
跨境电商图片翻译工具,批量翻译视频字幕一键抠图
人工智能·python·音视频
2601_962073814 小时前
Spring全面详解(基础版)
java·后端·spring
何以解忧,唯有..4 小时前
Pydantic 介绍与使用:Python 数据校验的现代方案
数据库·python·microsoft
IT_陈寒4 小时前
Vite打包时的静态资源坑,我帮你踩过了
前端·人工智能·后端
考虑考虑4 小时前
kubectl命令
运维·后端·自动化运维
第五页的你4 小时前
ElasticSearch结合本地消息表实现搜索功能
后端
谢亮_vipxieliang5 小时前
ValidX分组验证详解:不同场景使用不同验证规则
java·spring boot·后端·spring cloud·eclipse·hibernate