MVC5 Razor项目下拉选值触发Edge「离开站点」提示问题咨询

你提到的「在下拉菜单中使用@onchange属性直接调用控制器中的FinalizeValidation方法」的方案不可行，@onchange是前端HTML事件，只能绑定前端JS函数，无法直接和后端控制器方法交互。
以下是三个可行的解决方案，按改造成本从低到高排序：

方案1：提交前移除beforeunload监听（改造成本最低，无逻辑影响） #

Edge弹出离开提示的原因是页面全局绑定了beforeunload事件，用于检测用户未保存修改就离开页面的场景，正常表单提交会被该事件判定为「离开当前页面」，你可以在触发提交前手动移除该监听即可解决问题：

var triggerFinalizeValidation = function () {
    var selectedStatus = $('#StatusList').val();
    $("#CurrentSignificantActivityTypeName").val($("div.active").prop("id"));
    if (selectedStatus != 1) {
        navParams.userAction = true;
        $('#finalizeButton').prop('disabled', true);
        navParams.isDirty = false;
        // 新增：移除全局离开提示监听
        window.onbeforeunload = null;
        // 如果你的beforeunload是通过addEventListener绑定的，改用对应removeEventListener移除即可
        $('#FinalizeValidationButton').trigger('click');
}};

该方案完全不改动原有业务逻辑，仅新增1行代码即可兼容Edge，同时不影响IE11的原有表现。

方案2：改用AJAX异步提交（用户体验最优，无页面刷新） #

如果可以接受少量前后端逻辑调整，把原有同步表单提交改为AJAX异步请求，完全不会触发页面重载，自然不会弹出离开提示：

前端JS修改： #

var triggerFinalizeValidation = function () {
    var selectedStatus = $('#StatusList').val();
    var currentTypeName = $("div.active").prop("id");
    if (selectedStatus != 1) {
        navParams.userAction = true;
        $('#finalizeButton').prop('disabled', true);
        navParams.isDirty = false;
        // 收集表单全量数据，和原有提交的viewModel结构完全一致
        var postData = $('form').serialize();
        postData += "&CurrentActivityTypeName=" + currentTypeName;
        $.ajax({
            url: '@Url.Action("FinalizeValidation", "Risk")',
            type: 'POST',
            data: postData,
            success: function (res) {
                // 后端处理完成后，按需更新页面元素：显示日期选择器、启用Save按钮、更新计算后字段值等
                setVisibility();
                $('#SaveButton').prop('disabled', false);
            }
        })
}};

后端修改： #

把FinalizeValidation方法的返回值调整为JSON或者部分视图，不需要返回完整页面，前端拿到结果后直接更新对应DOM区域即可，完全无页面刷新。

方案3：隐藏iframe承接提交结果（无后端改动，无页面刷新） #

如果不想调整后端逻辑，也可以新增一个隐藏iframe承接表单提交结果，主页面不会触发重载：

1. 页面新增隐藏iframe

<iframe name="hiddenSubmitFrame" style="display: none;"></iframe>

2. 修改隐藏提交按钮的formtarget属性

<input id="FinalizeValidationButton" type="submit" name="action:FinalizeValidation" style="visibility:hidden" formtarget="hiddenSubmitFrame" />

提交后的响应会加载到隐藏iframe中，主页面不会触发任何跳转/重载，自然不会弹出离开提示，你可以监听iframe的load事件来处理后续的页面更新逻辑。

内容的提问来源于stack exchange，提问作者user2073183