Question

在MVC页面中，我有以下jQuery / javascript：

$("form").submit(function (event) {
    var inp = $("input"); inp.attr('value', inp.val());
    var html = replaceAll(replaceAll($('html')[0].outerHTML, "<", "&lt;"), ">", "&lt;");
    // event.preventDefault();
    $.ajax({
        url: "/Ajax/SetSession",
        asynch: false,
        dataType: "json",
        cache: false,
        type: "get",
        data: { name: 'html', data: html.substring(0, 1024) },
        error: function (xhr, status, error) {
            alert("Ouch! " + xhr.responseText);
            // $(this).unbind('submit').submit();
        },
        success: function (data) {
            alert("Awesome: " + data);
            // $(this).unbind('submit').submit();
        },
        complete: function (xhr, status) {
            alert('Phew!');
            $(this).unbind('submit').submit();
        }
    });
});

它意味着拦截正常的提交过程，在提交之前捕获页面的html，然后继续前进，好像什么都没发生一样。

但问题是，两个注释掉了，表单重新提交，正如预期的那样，控制器永远不会执行/ Ajax / SetSession url。然而，如果我取消注释它们，/ Ajax / SetSession会执行，但unbind似乎不起作用，因为表单似乎没有重新提交。

不确定这里发生了什么。我错过了什么？

任何和所有线索都表示赞赏。

Answer 1

event.preventDefault();应保持取消注释，因为这会阻止表单立即提交。显然你想控制提交表单的时刻。

$(this).unbind不起作用，因为内部成功和错误处理上下文不再形成 - 它是一个jQuery ajax上下文对象。你可以在这里做两件事来获得你想要的行为：

将上下文显式设置为表单对象。这可以通过context属性：

完成

$.ajax({
    ...
    context: this, //form here!
    ...
    success: function (data) {
        alert("Awesome: " + data);
        $(this).unbind('submit').submit(); //now this refers to form
    },

使用其他变量参考表格：

$("form").submit(function (event) {
    var form = this;
    ...
    $.ajax({
        ...
        success: function (data) {
            alert("Awesome: " + data);
            $(form).unbind('submit').submit(); //using form variable instead of this
        },

没有preventDefault，Ajax调用将无法工作

1 个答案: