制作页面的删除功能时,想要实现点击【删除】弹出确认对话框。目前状态是点击后没有弹出
```Html
<table class="table table-hover text-nowrap">
<thead>
<tr>
<th>种类</th>
<th>文件名</th>
<th>图片</th>
</tr>
</thead>
<tbody>
<tr th:each="photo : ${photo}">
<td th:text="${photo.name}">商品</td>
<td th:text="${photo.filename}">earth.jpg</td>
<td><img
th:src="@{/uploads/stock/{filename}(filename=${photo.filename})}"
alt="" width="100px"></td>
<td>
<form method="POST" th:action="'./photo_delete&'+${photo.id}" id="delete_1">
<input type="hidden" name="_token"
value="XV7tF73lP1V31unyV3Oxkj2siVujlZtLdM6snqO4"><a th:href="'./photo_delete&'+${photo.id}" class="btn btn-danger js-deleteBtn">删除</a>
</form>
</td>
</tr>
</tbody>
</table>
// 获取删除按钮元素
var deleteBtn = document.querySelector('.js-deleteBtn');
// 绑定点击事件
deleteBtn.addEventListener('click', function(event) {
// 阻止默认的链接点击行为
event.preventDefault();
// 弹出确认对话框
var confirmDelete = confirm("确定要删除吗?");
// 如果用户确认删除,则提交表单
if (confirmDelete) {
// 获取表单元素
var form = document.getElementById('delete_1');
// 提交表单
form.submit();
}
});
```
