添加“;您确定要在不保存的情况下离开页面吗;在窗体上弹出颜色框

add "are you sure you want to leave page without saving" on form with colorbox popup

本文关键字：窗体 颜色 离开 添加 保存 情况下      更新时间：2023-09-26

我有一个弹出颜色框上的表单，如果用户编辑了其中一个文本框，然后点击"取消"，我想要一个弹出窗口，显示类似"你确定要不保存就离开吗？"的内容。目前我有弹出窗口显示，但它显示在弹出的颜色框已经关闭之后

用户表页面

 $('a.openDialog').colorbox({
                iframe: true,
                transition: "elastic",
                width: "75%", height: "90%"
            });

实际表单页面

 $(':input', 'form').bind("change", function () {
                setConfirmUnload(true);
             });

function setConfirmUnload(on) {
              window.onbeforeunload = (on) ? unloadMessage : null;
          }
          function unloadMessage() {
              return 'You have entered new data on this page.' +
        ' If you navigate away from this page without' +
        ' first saving your data, the changes will be' +
        ' lost.';
      }

您可以在Cleanup或onClose上使用颜色框回调，如果这没有帮助，您可以在关闭按钮或div 上添加侦听器

我找到了解决方案，你必须调用colorbox的oncomplete函数，这是代码

$("#cboxClose").click(function (e) {
                        // stop any other script from firing
                        e.stopPropagation();
                        if (confirm('You have unsaved changes, are you sure that you want to cancel? All of your changes will be lost.')) {
                            $.colorbox.close();
                            // ensure that the binding is removed when closed
                            $("#cboxClose").unbind();
                        }
                    });
                } // close oncomplete
相关文章：