javascript - 通过 jQuery 将 HTML 加载到 DIV 时出现错误 404

Question

我有代码使用 jQuery 中的 $.load() 将 HTML 插入到 DIV 容器中，但我注意到有错误 404。这是 HTML 代码

<div id="mathstudents"></div>

和JavaScript

var div = $('#mathstudents');
var url = '@(Url.Action("ListOfMathStudents", "Outer"))';
div.load(url, { page: 1 }, function() { alert('Finished'); });

操作和 Controller 的名称正确。我仔细检查了这一点。当我将第二个参数添加为数据时，会出现问题:{ page: 1 }。

我尝试了下面这段基于 $.get() 的代码，它确实有效:

var div = $('#mathstudents');
var url = '@(Url.Action("ListOfMathStudents", "Outer"))';
$.get(url, { page: "1" }, function (data) {
    div.html(data);
});

我更喜欢 $.load() 因为它停留在 website 上它允许指定要插入的文档的一部分。

编辑: 这是 Controller 的代码:

[HttpGet]
public PartialViewResult ListOfMathStudents(int? page, bool? whichPage,
                                       int? sort, bool? asc,
                                       string filterType, string filterContent)
{
    IndexViewModel viewModel = new IndexViewModel();
    using (TestDBContext db = new TestDBContext())
    {
        viewModel.Students = getStudentList(db);
    }

    // Filtering
    if (filterType != null && filterContent != null)
    {
    }

    // Paging
    page = (whichPage == null) ? (page ?? 1) : (whichPage.Value ? page++ : page--);
    int maxPages = 0;
    int currentPage = getCurrentPage(page, viewModel.Students.Count(), out maxPages);
    viewModel.SPFDetails = new SPFDetails()
    {
        CurrentPage = currentPage,
        MaxPages = maxPages,
        MaxRecords = viewModel.Students.Count()
    };

    // Sorting
    if (sort != null)
    {
        viewModel.Students = sort == 1 ? viewModel.Students.OrderBy(x => x) : viewModel.Students.OrderByDescending(x => x);
    }

    viewModel.Students = viewModel.Students.Skip((currentPage - 1) * SPFDetails.GroupSize).Take(SPFDetails.GroupSize);

    viewModel.Students = viewModel.Students.ToList();
    return PartialView(viewModel);
}

编辑2: 我刚刚读到 $.load() 使用 POST 传输数据。当我尝试使用 $.post() 而不是 $.get() 时，我得到了相同的结果:错误 404。我虽然必须提供与操作签名和所有输入参数相匹配的 POST 参数的确切数量。所以我将脚本更改为:

var div = $('#mathstudents');

var url = '@(Url.Action("ListOfMathStudents", "Outer"))';
div.load(url, {
    page: 1,
    nextPage: null,
    sort: null,
    asc: null,
    filterType: null,
    filterContent: null
});

但它仍然显示错误 404。

Answer 1

将操作的属性从 [HttpGet] 更改为 [HttpPost]。正如您提到的，jQuery 加载函数使用 POST 类型。但如果提供了数据参数，则使用 POST，如果未提供数据参数，则使用 GET。

来自 API docs

The POST method is used if data is provided as an object; otherwise, GET is assumed.