Javascript jQuery UI日期选择器在日期选择时防止模糊事件

我有一个jQueryUIDatePicker并使用它进行内联编辑，也就是说，我最初将日期显示为标签，然后单击它替换为可编辑的日期选择器，然后选择，我做2件事； a） 在模型中设置所选日期（并在我的changeAction方法中执行一些验证），然后 b） 用标签替换日期文本框（以显示所选日期）

我的问题是，当选择任何日期时，如何防止模糊事件？我希望只有当用户没有选择任何日期而只是单击退出时，才会触发模糊事件

下面是我的代码

$(document).on("change", ".datePicker", function () {
    var dataValid = $(this).attr('data-valid');
    if (dataValid == "Y") {
        var currElmModelId = $(this).attr('data-model-id');
        var currElmModelAttr = $(this).attr('data-model-attr');
        var divEle = $('<div />', {'class': 'editableDateTxt','name':currElmModelAttr, 'data-model-attr':currElmModelAttr,'data-model-id':currElmModelId,'html':$(this).val()});
        var parent = $(this).parent();
        parent.append(divEle);
        $(this).remove();
    }
});


$(document).on("blur",".datePicker", function () {
    if (this.hasAttribute('data-model-id')) {
        var dataValid = $(this).attr('data-valid');

        if (typeof dataValid == "undefined" || dataValid == "Y") {
            var currElmModelId = $(this).attr('data-model-id');
            var currElmModelAttr = $(this).attr('data-model-attr');
            var divEle = $('<div />', {'class': 'editableDateTxt','name':currElmModelAttr, 'data-model-attr':currElmModelAttr,'data-model-id':currElmModelId,'html':$(this).val()});
            var parent = $(this).parent();
            parent.append(divEle);
            $(this).remove();
            return false;
        }
    }   
});

changeAction: function (event) {
    var self = this;
// my custom code to set the date in model and do some validations
}

$（document）.on（“更改”，“日期选择器”，函数（）{
var dataValid=$（this.attr（'data-valid'）；
如果（数据有效==“Y”）{
var currElmModelId=$（this.attr（'data-model-id'）；
var currElmModelAttr=$（this.attr（'data-model-attr'）；
var divEle=$（“”，{'class'：'editableDateTxt'，'name'：currElmModelAttr，'data model attr'：currElmModelAttr，'data-model-id'：currElmModelId，'html'：$（this.val（））；
var parent=$（this.parent（）；
parent.append（divEle）；
$（this.remove（）；
}
});
$（文档）.on（“模糊”，“日期选择器”，函数（）{
if（this.hasAttribute（'data-model-id'））{
var dataValid=$（this.attr（'data-valid'）；
if（typeof dataValid==“undefined”| | dataValid==“Y”）{
var currElmModelId=$（this.attr（'data-model-id'）；
var currElmModelAttr=$（this.attr（'data-model-attr'）；
var divEle=$（“”，{'class'：'editableDateTxt'，'name'：currElmModelAttr，'data model attr'：currElmModelAttr，'data-model-id'：currElmModelId，'html'：$（this.val（））；
var parent=$（this.parent（）；
parent.append（divEle）；
$（this.remove（）；
返回false；
}
}   
});
changeAction:函数（事件）{
var self=这个；
//我的自定义代码用于在模型中设置日期并执行一些验证
}

关于“更改”事件添加数据previouse event=“更改”

$（document）.on（“更改”，“日期选择器”，函数（）{
var dataValid=$（this.attr（'data-valid'）；
如果（数据有效==“Y”）{
var currElmModelId=$（this.attr（'data-model-id'）；
var currElmModelAttr=$（this.attr（'data-model-attr'）；
var divEle=$（“”，{'class'：'editableDateTxt'，'name'：currElmModelAttr，'data model attr'：currElmModelAttr，'data-model-id'：currElmModelId，'html'：$（this.val（））；
var parent=$（this.parent（）；
parent.append（divEle）；
$（this.remove（）；
}
$（此）.data（“先前触发的事件”、“更改”）；
});

若之前的模糊事件调用发生了变化，那个么在jQuery中的模糊事件之前添加寄存器回调。 这很容易做到，我想你自己也能做到

然后在模糊事件上添加：

$(document).on("blur",".datePicker", function () {
if ($(this).data("previous-fired-event") === "change")
  return;

  $(this).data("previous-fired-event", "blur");

if (this.hasAttribute('data-model-id')) {
    var dataValid = $(this).attr('data-valid');

    if (typeof dataValid == "undefined" || dataValid == "Y") {
        var currElmModelId = $(this).attr('data-model-id');
        var currElmModelAttr = $(this).attr('data-model-attr');
        var divEle = $('<div />', {'class': 'editableDateTxt','name':currElmModelAttr, 'data-model-attr':currElmModelAttr,'data-model-id':currElmModelId,'html':$(this).val()});
        var parent = $(this).parent();
        parent.append(divEle);
        $(this).remove();
        return false;
    }
}   
});

$（document）.on（“模糊”，“日期选择器”，函数（）{
if（$（this）.data（“先前触发的事件”）==“更改”）
回来
$（此）.data（“上次激发的事件”、“模糊”）；
if（this.hasAttribute（'data-model-id'））{
var dataValid=$（this.attr（'data-valid'）；
if（typeof dataValid==“undefined”| | dataValid==“Y”）{
var currElmModelId=$（this.attr（'data-model-id'）；
var currElmModelAttr=$（this.attr（'data-model-attr'）；
var divEle=$（“”，{'class'：'editableDateTxt'，'name'：currElmModelAttr，'data model attr'：currElmModelAttr，'data-model-id'：currElmModelId，'html'：$（this.val（））；
var parent=$（this.parent（）；
parent.append（divEle）；
$（this.remove（）；
返回false；
}
}   
});

$(document).on("blur",".datePicker", function () {
if ($(this).data("previous-fired-event") === "change")
  return;

  $(this).data("previous-fired-event", "blur");

if (this.hasAttribute('data-model-id')) {
    var dataValid = $(this).attr('data-valid');

    if (typeof dataValid == "undefined" || dataValid == "Y") {
        var currElmModelId = $(this).attr('data-model-id');
        var currElmModelAttr = $(this).attr('data-model-attr');
        var divEle = $('<div />', {'class': 'editableDateTxt','name':currElmModelAttr, 'data-model-attr':currElmModelAttr,'data-model-id':currElmModelId,'html':$(this).val()});
        var parent = $(this).parent();
        parent.append(divEle);
        $(this).remove();
        return false;
    }
}   
});