javascript - 在 <a> 元素上使用 onclick

Question

我有一个包含 href 属性的 a 元素。单击它会删除数据，因此我希望用户确认该操作。 href 属性指的是一个 php 文件，其中包含 GET 参数中将删除的数据的 id。我添加了一个 onclick 属性，它应该执行以下 JS 片段(它显示一个要求确认的语义 UI 模式):

    confirmmodal = function () {
    beforeunload = function () {
        $('.ui.basic.modal')
            .modal({
                closable: false,
                onDeny: function () {
                    return false;
                },
                onApprove: function () {
                    return true;
                }
            })
            .modal('show')
        ;
}
}

但是当我运行它时，它仍然会转到删除数据的页面(尽管我还没有构建它，所以没有删除任何内容)。是否有一个选项可以以某种方式使 onclick 属性优先于 href 属性？

Answer 1

您需要添加event.preventDefault()在代码末尾。

例如:

<a href="somePage.php" onclick="showDialog(event)">Delete</a>



function showDialog(e) {
    // custom code to show dialog here
    e.preventDefault();
}