在前端开发中，有时候我们需要给用户一个确认提示，让用户确认是否进行某个操作。比如，在删除一篇博客、取消订单等场景下，就需要我们使用确认对话框来获取用户的确认。
本文将介绍如何在单击链接时显示确认对话框，并提供示例代码。
HTML 链接
首先，我们需要了解 HTML 链接的基本结构：
-- -----------------------------------
其中，href 属性指定了链接的目标地址，Link 是链接的文本内容。
如果我们想要在单击链接时显示确认对话框，可以通过 JavaScript 来实现。
JavaScript 点击事件
JavaScript 提供了 click 事件，该事件会在元素被点击时触发。我们可以利用这个事件来监听链接的点击操作。
示例代码如下：
-- -------- --------------- ------------ --- -------------------
在上述代码中，我们用 onclick 属性绑定了一个 JavaScript 函数，该函数返回 confirm 对话框的结果。当用户单击链接时，将弹出一个确认对话框，询问用户是否进行删除操作。
注意，我们将 href 属性设置为 "#"，是为了阻止链接的默认跳转行为。如果不这样做，页面将会跳转到当前页面并刷新。
优化代码
上述示例代码虽然可以实现确认对话框的功能，但是不太优雅。我们可以将 JavaScript 代码单独写成一个函数，然后在 HTML 中引用。
示例代码如下：
-- -------- --------------- --------------------------- -------- -------- --------------- - ------ ------------ --- -------- - ---------
通过将 JavaScript 函数单独写成一个函数，可以使代码更加清晰可读，并提高代码的复用性。
结论
本文介绍了如何在单击链接时显示确认对话框。通过监听链接的点击事件，利用 JavaScript 显示确认对话框，可以提高用户体验，避免用户误操作。
同时，我们还给出了优化代码的方法，使代码更加清晰可读，提高代码的复用性。
以上就是本文的全部内容。希望能对您有所帮助！
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/9260