文本框中的日期选择器和焦点

本文关键字:选择器 焦点 日期 文本 | 更新日期: 2023-09-27 18:11:12

我在文本框上有一个日期选择器,同时我使用一个函数来检查用户是否使用javascript输入了正确的日期和时间格式。

我面临的问题是,每当我在文本框上选择鼠标时,日期选择器就会显示,因为它应该,但如果我想从日期选择器中选择一个日期,则执行focusout()函数,我必须再次重新单击要选择的日期选择器。

下面是我的代码:
     $('#StartDateTime').datepicker({
        /* here is only to stay focusin() on the textbox after selecting date */
        constrainInput: false,
        fixFocusIE: false,
        onSelect: function (dateText, inst) {
            this.fixFocusIE = true;
            $(this).change().focus();
        },
        onClose: function (dateText, inst) {
            this.fixFocusIE = true;
            this.focus();
        },
        beforeShow: function (input, inst) {
            var result = $.browser.msie ? !this.fixFocusIE : true;
            this.fixFocusIE = false;
            return result;
        }
    }).click(function () { $(this).focus() });
    $("#StartDateTime").focusout(function () {
        if (sDTValid() == false) {
            alert("Please enter Date (Day/Month/Year) & Time (HH:MM AM or PM)");
        }
    });
    function sDTValid() {
    /* this is the function of date and time format validation*/
        var sDT = document.getElementById('StartDateTime').value;
        if (sDT.match(/^('d{1,2})'/('d{1,2})'/('d{4}) ('d{1,2}):('d{2}) (.*)$/)) {
            return true;
        }
        else {
            return false;
        }
    }

文本框中的日期选择器和焦点

'focusout'事件将在用户点击日期picker元素时触发,因为它不是输入#StartDateTime的一部分

可以在值改变时使用其他事件。"输入"

$("#StartDateTime").on('input', function () {
    if (sDTValid() == false) {
        alert("Please enter Date (Day/Month/Year) & Time (HH:MM AM or PM)");
    }
});