在删除之前确认href链接

Question

在删除数据库中的内容之前，我计划使用确认框提醒用户，以防选择错误行。

href的代码

echo '<td align="center" valign="middle"><a href="delete.php?id='.$row["id"].'" class="confirmation"><img src="img/icon/delete.png"></a></td>';

Java script

<script type="text/javascript">
    var elems = document.getElementsByClassName('confirmation');
    var confirmIt = function (e) {
        if (!confirm('Are you sure?')) e.preventDefault();
    };
    for (var i = 0, l = elems.length; i < l; i++) {
        elems[i].addEventListener('click', confirmIt, false);
    }
</script>

当点击“删除”图片时，它只是删除行，没有确认框出现吗？

- Joseph Thomas Mallinson

---

嘿，Joseph，你确定elems数组不是空的，所以循环实际上可以浏览你的确认链接吗？ - wilsotobianco

确保你的脚本标签位于页面末尾，或者至少在链接之后。 - Abozanona

太棒了，@YazanWYusuf 谢谢你。 - Joseph Thomas Mallinson

我认为@YazanWYusuf应该回答这个问题，即使有一些“之后”发布的答案，这也是公平的。 - Funk Forty Niner

@JosephThomasMallinson 我已经在你的评论下发布了一个答案。如果我的回答真的对你有帮助，我希望你能接受它。 - Abozanona

Answer 1

确保脚本标签位于页面末尾，或者至少在链接之后。

- Abozanona

---

还可以使用jQuery。然后脚本可以在顶部定义。逻辑将在onPageLoaded事件处理程序中启动。 - Mischa

Answer 2

PHP

echo '<td align="center" valign="middle"><a data-href="delete.php?id='.$row["id"].'" href="javascript:;" onclick="confirmToDelete(this);"><img src="img/icon/delete.png"></a></td>';

JavaScript

<script>
  function confirmToDelete(element){
    if(!element) return false;
    if(confirm('Are you sure?')) self.location.href=element.getAttribute('data-href');
  }
</script>

- Vịnh Hảo Hoàn

---

这样做是可行的，但它涉及将文档结构与应用程序逻辑混合在一起 - 从长远来看不是一个好主意。 - Christian

这样做是可行的，但它涉及将文档结构与应用程序逻辑混合在一起 - 从长远来看不是一个好主意。 - Christian

Answer 3

尝试以下代码。您可以在不使用外部 JavaScript 的情况下完成。只需在链接的 onlick 事件中添加 confirm 函数即可。

PHP

echo '<td align="center" valign="middle"><a href="delete.php?id='.$row["id"].'" class="confirmation" onclick="return confirm(\'Are you sure?\');"><img src="img/icon/delete.png"></a></td>';

- MahdiY