MVC AJAX POST 请求作为 GET 重定向到原始页面

Question

希望有人能以此为我指明正确的方向，我整天都在为此挠头，并且正在发展一个秃头。我在 SO 上花了很多时间，但我发现的问题似乎都与我的确切问题无关。

简而言之，我有一个下拉列表，并希望让用户能够实时将条目添加到列表中。我打算使用 AJAX 将表单信息发送到控制器，然后将其输入表中，重新查询，然后作为 JSON 数组传递回页面，然后我将对其进行解析并替换 Select 下拉列表中的数据。

但是，会发生 POST 请求，并且在数据处理期间的某个时刻页面刷新并且数据作为 GET 请求附加到 URL。

AJAX 请求：

$(document).on("click", "#save-new-range", function (e) {
    e.preventDefault;

    var loc = window.location.href;
    var url = stripURL('Data/addRange', loc); // Format the target URL correctly

    $.post(url, $("#add-range-form").serialize())
        .done(function (response) {
            debugger;
            alert(response);
    });
});

StripURL 函数（以防万一！）

function stripURL(url, loc) {
var res = "";

if (loc.search("Surveys/New") !== -1) {
    res = loc.replace("Surveys/New", "");
} else if (loc.search("Surveys/Amend") !== -1) {
    res = loc.replace("Surveys/Amend", "");
} else if (loc.search("Surveys/") !== -1) {
    res = loc.replace("Surveys/Amend", "");
}


if (res.search("#") !== -1) {
    res = res.replace("#", "");
}

url = res + url;

return url;
}

控制器（没有查询和插入）：

[HttpPost]
public JsonResult addRange(FormCollection fc)
{
    {
    ... Do data processing and query data into a dictionary called res ...
    }
    return Json(res);
}

调试，我的控制器动作被处理并且 res 填充了正确的数据，但是由于重定向，永远不会进入 .done() 函数。

很高兴发布完整的控制器，但为简洁起见将其省略。如果你想看，请告诉我。

Answer 1

您正在使用e.preventDefault 而不将其作为函数调用。这不会运行。这就是为什么 return false; 在接受的答案中起作用的原因。使用e.preventDefault() 作为函数调用不需要return false;。

$(document).on("click", "#save-new-range", function (e) {

    // called as a function
    e.preventDefault();

    var loc = window.location.href;
    var url = stripURL('Data/addRange', loc); // Format the target URL correctly

    $.post(url, $("#add-range-form").serialize())
        .done(function (response) {
            debugger;
            alert(response);
    });
});

您可以像这样在 SO 的控制台中进行测试：

$('a').click(function(e){
    e.preventDefault();
});

这将阻止任何a 标记的默认行为。如果你省略了函数调用，它什么也不做。

Answer 2

$(document).on("click", "#save-new-range", function (e) {
    e.preventDefault;

    var loc = window.location.href;
    var url = stripURL('Data/addRange', loc); // Format the target URL correctly

    $.post(url, $("#add-range-form").serialize())
        .done(function (response) {
            debugger;
            alert(response);
    });

    return false;
});

看看这能不能解决问题。