单击问题 - 确认警报不会阻止 HREF 单击

Question

我正在尝试完成以下任务：

当用户单击包含复选框的 div("productListMatch") 外部时，如果选中任何复选框，则会出现确认警报，让用户知道他们尚未保存在那里复选框选择。

简而言之，我正在检查选中的项目是否已保存。如果是这样，请通知用户，让他们选择保存或不保存。

这就是我所做的：

function formCheckboxConfirm() {
    $('html').click(function() {
        var elem = document.getElementById('frm-list-product').elements;
        for (i = 0; i < elem.length; i++) {
            if(elem[i].type == "checkbox" && elem[i].checked) {
                confirm("You have made changes! Do you want to proceed without saving your changes?");
                break;
            }
        }
});

    $(".productListMatch").click(function(e) {
        e.stopPropagation(); // I thought this would stop all link clicks, but it's not working as I expected.
    });
}

虽然这通常有效，但它不适用于链接。单击它们后，它们会继续执行，并且我仍然会收到确认警报。

注意：网页上的 div 之外有许多导航链接。 “productListMatch”div 本身是 jquery 选项卡（两个中的第二个）内内容的一部分，因此必须单击该选项卡才能看到“productListMatch”div。

我想要的是这样的：

• 如果单击除复选框（和“保存”按钮）之外的任何链接
  • 停止链接执行
    • 检查复选框是否被选中
      • 如果选中复选框，则提供确认警报
        • 如果用户点击“确定”，网页将继续访问最初点击的链接
        • 如果用户点击“取消”，网页将不会继续访问最初点击的链接
      • 如果未选中某个复选框，则不会出现确认警报，并且网页会继续链接最初选中的链接

，我尝试了几种方案，虽然我可以让链接停止（我使用了 PreventDefault），但我不确定如何让它们重新启动。也许我对这整件事的看法都是错误的。

我希望得到一些帮助。

谢谢。

斯蒂芬

Answer 1

confirm() 函数返回一个您需要测试的布尔值。例如：

if confirm("You have made changes! Do you want to proceed without saving your changes?") {
   // continue or whatever 
} else {
   return false; // or break or whatever
}