javascript - 通过离开页面防止丢失表单数据

Question

我正在创建一个包含数百行的数据网格，其中每行包含一个复选框，以便用户可以从网格中选择一个项目。

现在，用户可能会花费大量时间在网格中过滤/搜索并勾选所需的复选框，结果却不小心按下了键盘上的退格键或单击了页面上的超链接。而且他们会丢失所有的复选框选择。

所以我想介绍一些功能，如果至少勾选了一个复选框，那么如果用户无意中做了一个将他们导航离开页面的操作，那么会显示一条 JavaScript 确认消息来通知用户这一点.

复选框都属于同一个组，例如它会被称为“产品”。

这有可能吗？

Answer 1

有一个 beforeunload 事件发生在用户导航离开时:http://jsfiddle.net/FprNV/1/ .

在那里返回一个字符串会导致出现一 strip 有两个按钮(停留/导航)的消息；此对话框的确切实现因浏览器而异。

$(window).bind('beforeunload', function() {
    var checkboxcount = $("input:checkbox:checked").length;
    if(checkboxcount > 0) {
        return 'Are you sure?';
    }
});