我认为你的方法获得了大量的流量。我认为向用户指出他们留下了未保存的数据更有意义。你可以使用beforeunload事件来实现这一点。然而，当用户关闭窗口时，这会达到一个限制。
代码可能如下所示。

<script type="text/javascript">
    (function() {
        window.addEventListener('DOMContentLoaded', () => {
            let isChanged = false;
            document.querySelectorAll('input').forEach(elem => {
                elem.addEventListener('change', () => {
                    isChanged = true; 
                });
            });

            document.querySelector('form').addEventListener('submit', () => {
                isChanged = false;
            })

            window.addEventListener('beforeunload', (evt) => {
                if (isChanged) {
                    evt.returnValue = isChanged;
                }
            });
        });
    })();
</script>

正如您所想，仍然可以使用AJAX在后台为每个触发的事件向服务器发送表单数据。
x一个一个一个一个x一个一个二个x
如果您只想发送更改的输入而不是整个表单，那么代码很容易修改。

<script type="text/javascript">

    (function() {
        window.addEventListener('DOMContentLoaded', () => {
            document.querySelectorAll('input').forEach(elem => {
                elem.addEventListener('change', function() {
                    const formData = new FormData();
                    formData.append(this.name, this.value); 
                    fetch('/settings', {
                        method: 'post', 
                        body: formData
                    });
                });
            });
        });
    })();

</script>