Question

好的，这有点奇怪，我很惊讶。我想知道是否有人知道这是一个预期的行为还是一些错误。

在ASP.NET MVC应用程序中，我使用jQuery进行客户端事件。我有几个日期选择器，我尝试通过在datepicker对象上使用onSelect属性覆盖点击事件的标准日颜色模式。

基本上，在onSelect上，我使用AJAX调用向服务器询问我想要在确定颜色上显示的日期并更改它们（通常是在将点击的日期添加到“标记”日期列表之后）。

我的代码似乎没有覆盖默认行为（当你点击一天所有日子获得标准颜色并且你点击的那一天被突出显示时），它似乎在它之后执行（因此重绘状态和颜色）在我的愿望的datepicker上。）

我发现让我感到惊讶的是，如果我使用$ .ajax来调用服务器，我的代码会在显示标准颜色模式的“默认行为”之前执行，但如果我使用$ .post，我的代码会在之后执行“默认行为”覆盖标准颜色模式。

以下是一些代码示例：

$("#diasNoLectivosHolder").datepicker({ 
    minDate: arrayNoLaborables[0], 
    maxDate: arrayNoLaborables[1],
    onSelect: function (fecha, calendar, event) {
        $.post($.url("Grupos/diaNoLaborable/" + $("#idGrupo").val() + "/" + fecha.replace(/\//g, ".")), function (xmlResponse) {
            if (xmlResponse)
                $.post($.url("Grupos/obtenerDiasNoLaborables/" + $("#idGrupo").val()), function (xmlDias) {
                    marcarNoLaborables(xmlDias);
                });
            $("#fechaInicio").change();
            return false;
        });
        return false;
    },
    onChangeMonthYear: function () {
        $.post($.url("Grupos/obtenerDiasNoLaborables/" + $("#idGrupo").val()), function (xmlResponse) { marcarNoLaborables(xmlResponse); });
    }
});

在这个例子中，日历点击任何一天后日历会短暂闪烁到标准颜色模式，并完成显示我的marcarNoLaborables（xmlDias）的颜色模式;方法定义。

相反，如果我使用：

$("#diasNoLectivosHolder").datepicker({ 
    minDate: arrayNoLaborables[0], 
    maxDate: arrayNoLaborables[1],
    onSelect: function (fecha, calendar, event) {
        $.ajax({ 
            async: false,
            cache: false,
            url: $.url("Grupos/diaNoLaborable/" + $("#idGrupo").val() + "/" + fecha.replace(/\//g, ".")),
            success: function (xmlResponse) {
                if (xmlResponse)
                    $.ajax({ 
                        async: false,
                        cache: false,
                        url: $.url("Grupos/obtenerDiasNoLaborables/" + $("#idGrupo").val()),
                        success: function (xmlDias) {
                            marcarNoLaborables(xmlDias);
                        }
                    });
                $("#fechaInicio").change();
                return false;
            }
        });
        return false;
    },
    onChangeMonthYear: function () {
        $.post($.url("Grupos/obtenerDiasNoLaborables/" + $("#idGrupo").val()), function (xmlResponse) { marcarNoLaborables(xmlResponse); });
    }
});

datePicker，在任何一天点击后，完成绘制“标准颜色模式”，如果我单步执行代码我可以看到我的修改颜色模式适用，但在完成我的代码时，标准模式适用。 / p>

所以我的问题是......任何人都知道为什么使用$ .ajax或$ .post会影响执行代码的时刻是否遵循“默认的datepicker行为”？

随意问一些我的解释不清楚的事情。英语不是我的母语，有时我发现很难解释这样复杂的情况。

谢谢大家。

Answer 1

代码在脚本中的不同位置执行的原因是设置了“async”选项。

默认情况下，“async”选项设置为true，这意味着在创建XHR时不会阻止代码执行。通常这是想要的行为，因为当您的脚本调用服务器以获取更多数据时，您不希望阻止UI线程。

将“async”选项设置为false会更改为行为，以便脚本暂停，直到服务器响应为止。

我不确定你的剧本的最终目标是什么，所以我不能就你应该做什么做出推荐。但您应该知道$.post方法只是$.ajax方法的简写，其中包含以下选项：

$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

因此，如果绝对需要同步的阻止行为（不推荐），您可以获得一个“POST”类型的AJAX请求，并将相同的选项传递给$ .ajax。

希望这有帮助。

jQuery datePicker中的奇怪行为

1 个答案: