Javascript 未调用jQuery submit（）

我尝试在提交行为上覆盖

，因此我使用下一个代码：

<script type="text/javascript">
    $(function () {
        var form = $("#FilterForm");

        form.submit(function () {
            alert("Submit");

            $.ajax({
                url: form.attr("action"),
                type: 'POST',
                data: new FormData(this),
                processData: false,
                contentType: false,
                success: function (response) {
                    alert(response);
                    $('#Container').html(response);
                },
                error: function () {
                    $('#Container').html(loadingFailedStr);
                },
                timeout: 15000
            });

            return false;
        })
    });
</script>

$（函数（）{
变量形式=$（“#过滤性能”）；
表单提交（函数（）{
警报（“提交”）；
$.ajax({
url:form.attr（“操作”），
键入：“POST”，
数据：新表单数据（本），
processData:false，
contentType:false，
成功：功能（响应）{
警报（响应）；
$（'#Container'）.html（响应）；
},
错误：函数（）{
$（'#Container'）.html（loadingFailedStr）；
},
超时：15000
});
返回false；
})
});

此脚本块位于我的表单之后。此表单在局部视图中声明：

<div class="panel card-0">
    <div class="panel-body">
        @using (Html.BeginForm("TasksGridViewPartial", "Tasks", new { StaffId = staffId, StageId = stageId }, FormMethod.Post, new { id = "FilterForm", enctype = "multipart/form-data" }))
        {
            <fieldset>
                <div class="form-group row">
                    <div class="col-md-2 col-sm-6">
                        @Html.Label(Headers.DateCreate)
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.CreatedOn1, new { @class = "form-control" })
                        </div>
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.CreatedOn2, new { @class = "form-control" })
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        @Html.Label(Headers.DateClose)
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.ClosedOn1, new { @class = "form-control" })
                        </div>
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.ClosedOn2, new { @class = "form-control" })
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        @Html.Label(Headers.DateStart)
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.StartDate1, new { @class = "form-control" })
                        </div>
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.StartDate2, new { @class = "form-control" })
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        @Html.Label(Headers.DateEnd)
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.EndDate1, new { @class = "form-control" })
                        </div>
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.EndDate2, new { @class = "form-control" })
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        @Html.Label(Headers.DateCheck)
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.VerifiedOn1, new { @class = "form-control" })
                        </div>
                        <div class="datepicker">
                            @Html.TextBoxFor(m => m.VerifiedOn2, new { @class = "form-control" })
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        @Html.Label(Headers.TaskNumber)
                        <div style="padding: 4px;">
                            @Html.TextBoxFor(m => m.VerifiedOn1, new { @class = "form-control", type = "number" })
                        </div>
                        <div style="padding: 4px;">
                            @Html.TextBoxFor(m => m.VerifiedOn2, new { @class = "form-control", type = "number" })
                        </div>
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-md-3 col-sm-6">
                        @Html.LabelFor(m => m.Executors)
                        @Html.ListBoxFor(m => m.Executors, executors, new { @class = "selectpicker form-control", @title = Messages.ChooseExecutors, multiple = "" })
                    </div>
                    <div class="col-md-3 col-sm-6">
                        @Html.LabelFor(m => m.Projects)
                        @Html.ListBoxFor(m => m.Projects, projects, new { @class = "selectpicker form-control", @title = Messages.ChooseProjects, multiple = "" })
                    </div>
                    <div class="col-md-3 col-sm-6">
                        @Html.LabelFor(m => m.Statuses)
                        @Html.ListBoxFor(m => m.Statuses, statuses, new { @class = "selectpicker form-control", @title = Messages.ChooseStatuses, multiple = "" })
                    </div>
                </div>
                <div class="form-group row" style="padding-top: 24px;">
                    <div class="col-md-12">
                        <button type="submit" class="btn btn-primary">@Actions.Apply</button>
                        <button type="button" class="btn btn-default">@Actions.ClearFilters</button>
                        <button type="button" class="btn btn-default">@Actions.ShowAccepted</button>
                        <button type="button" class="btn btn-default">@Actions.HideAccepted</button>
                    </div>
                </div>
            </fieldset>
        }
    </div>
</div>

@使用（Html.BeginForm（“TasksGridViewPartial”，“Tasks”，new{StaffId=StaffId，StageId=StageId}，FormMethod.Post，new{id=“FilterForm”，enctype=“multipart/form data”}））
{
@Label（Headers.DateCreate）
@TextBoxFor（m=>m.CreatedOn1，新的{@class=“form control”}）
@TextBoxFor（m=>m.CreatedOn2，新的{@class=“form control”}）
@Label（Headers.DateClose）
@TextBoxFor（m=>m.ClosedOn1，新的{@class=“form control”}）
@TextBoxFor（m=>m.ClosedOn2，新的{@class=“form control”}）
@Label（Headers.DateStart）
@TextBoxFor（m=>m.StartDate1，新的{@class=“form control”}）
@TextBoxFor（m=>m.StartDate2，新的{@class=“form control”}）
@Label（Headers.DateEnd）
@TextBoxFor（m=>m.EndDate1，新的{@class=“form control”}）
@TextBoxFor（m=>m.EndDate2，新的{@class=“form control”}）
@Html.Label（Headers.DateCheck）
@TextBoxFor（m=>m.VerifiedOn1，新的{@class=“form control”}）
@TextBoxFor（m=>m.VerifiedOn2，新的{@class=“form control”}）
@Html.Label（Headers.TaskNumber）
@TextBoxFor（m=>m.VerifiedOn1，新的{@class=“formcontrol”，type=“number”}）
@TextBoxFor（m=>m.VerifiedOn2，新的{@class=“formcontrol”，type=“number”}）
@LabelFor（m=>m.Executors）
@Html.ListBoxFor（m=>m.Executors，Executors，new{@class=“selectpicker form control”，@title=Messages.ChooseExecutors，multiple=”“}）
@LabelFor（m=>m.Projects）
@Html.ListBoxFor（m=>m.Projects，Projects，new{@class=“selectpicker form control”，@title=Messages.ChooseProjects，multiple=”“}）
@LabelFor（m=>m.status）
@Html.ListBoxFor（m=>m.Statuses，Statuses，new{@class=“selectpicker form control”，@title=Messages.ChooseStatuses，multiple=”“}）
@行动。应用
@操作.ClearFilters
@已接受的操作
@Actions.hideacepted
}

我通过调用

@Html.Action（“FilterPartial”）

最有趣的是，我在on document ready事件中选中了

form

变量，并将其声明为需要。但是仍然没有调用

submit

。

---

哪里可能有问题？

返回false

还不够，您还需要阻止默认值：

$(function () {
        var form = $("#FilterForm");

        form.submit(function (e) { // Pass the event to the function
            e.preventDefault(); // Stop the form submitting.

            $.ajax({
                url: form.attr("action"),
                type: 'POST',
                data: new FormData(this),
                processData: false,
                contentType: false,
                success: function (response) {
                    alert(response);
                    $('#Container').html(response);
                },
                error: function () {
                    $('#Container').html(loadingFailedStr);
                },
                timeout: 15000
            });

            return false;
        })
    });

---

从事件处理程序返回false将自动调用

event.stopPropagation（）

和

event.preventDefault（）

。当然，谢谢！但我的问题不是这个。它不是绝对调用的，因此函数体中的所有代码都没有任何值。对未调用的事件处理程序调用preventDefault将不会产生任何影响@为什么不尝试将其更改为

$（“#FilterForm”）.submit（function（）{…}）

@freedomn-m，不调用？你是什么意思？当“就绪”事件触发时，你确定表单是页面的一部分吗？如果不是这样，你就不会出错。您是否尝试过通过委托绑定？我将此变量记录在ready函数中，它已定义且不为null。您是否有具有相同ID的其他表单（或任何其他元素）？它将始终为“已定义且不为null”，因为jquery就是这样工作的。检查长度：

alert（$（“form”）.length）

要检查，您需要

console.log（form.length）

。这个