Избегайте повторного открытия datepicker после выбора даты

Ответ 1

Это лучшее решение, которое я могу получить:

(вдохновлен эта ссылка)

jsFiddle

$('#datepicker').datepicker({
            /* fix buggy IE focus functionality */
            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()});

Обратите внимание, как вы предложили в своем вопросе im, используя jquery-UI 1.9.0. В вашем примере вы использовали jquery-ui 1.8.15, который, как известно, ошибочен в некоторых событиях (например, beforeShow() в IE).

Ответ 2

Сегодня я столкнулся с этой проблемой и имел для меня другое решение. Мой сценарий заключался в том, что мой DatePicker находился внутри всплывающего окна JQuery UI Dialog. В Chrome все отлично работало, но в IE календарь всегда появлялся после выбора даты.

Как оказалось, в jQuery 1.10.1 есть открытая ошибка: http://bugs.jqueryui.com/ticket/9125

Существует также JSFiddle, связанный с тем, что демонстрирует ошибку в IE. Есть два способа заставить это работать в IE:

• Установите modal в false
• Сфокусируйтесь на другом элементе сразу после выбора даты

Я пошел С# 2, и вот пример исправления (просто обновление кода JSFiddle):

Разметка:

<div id="dialog">
    <input id="datepicker" />
    <input type='button' value='save' id='btnSave'/>    
</div>

JS:

$( "#datepicker" ).datepicker({onSelect: function() { $('#btnSave').focus(); }});
$( "#dialog" ).dialog({ modal: true });

Надеюсь, это поможет кому-то в будущем!

Ответ 3

Я использую это для IE, он также останавливает повторное открытие datepicker

JQuery

        onSelect: function(){ 
        $("#focusfix").focus();
    },

HTML (первая строка диалога div):

<input class="ui-helper-hidden-accessible" id="focusfix" type="text"autofocus/>

Ответ 4

Так как .browser удаляется после jQuery 1.9, мне пришлось слегка модифицировать код. Это работает для меня:

$('#datepicker').datepicker({
    /* fix buggy IE focus functionality */
    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 = true;
          if (navigator.appName == 'Microsoft Internet Explorer') {
            result = !this.fixFocusIE;
          }
          this.fixFocusIE = false;
          return result;
    }
}).click(function(){$(this).focus()});

Ответ 5

Некромантия.
У меня была та же проблема, но ни один из упомянутых здесь ответов не работал.
Это может быть потому, что код, который я должен работать над работами с iframe, но я не уверен точно.
В верхней части я не мог обновиться до последней версии, потому что это нарушит совместимость с остальной частью проекта, над которым я должен был работать.

Так вот что я исправил для меня:

initDatePicker: function ()
{
    // Initialize datepicker 
    var qs = document.getElementsByClassName("datepick");
    for (var i = 0; i < qs.length; ++i)
    {
        $(qs[i]).datepicker(
        {
            // showOn: "button"
            // showOn: "both"
              showOn: "focus"
            , buttonImage: "../images/cal.gif"
            , buttonImageOnly: true
            //, buttonImageOnly: false
            , dateFormat: 'dd.mm.yy'
            , changeMonth: true
            , changeYear: true
            , showWeek: false // true
            , firstDay: 1
            , showOtherMonths: true //false 
            , selectOtherMonths: true
            , showButtonPanel: true


            //,onSelect : function(x, u){
            //    // $(this).focus(); 

            //    window.setTimeout(function () { $("#txtSchulungsTyp").focus(); $(this).datepicker("hide"); }, 300);
            //},
            //onClose: function(e){
            //    // e.preventDefault();
            //    e.preventDefault ? e.preventDefault() : e.returnValue = false;
            //    return false;
            //}



            , onSelect: function ()
            {
                $(this).datepicker('disable');
            }
            , onClose: function ()
            {
                window.setTimeout(function (e)
                {
                    $(e).datepicker('enable')
                }.bind(undefined, this), 500)
            }

        })
        ; // End datepicker


        // console.log(mGlobalLanguage);

        // $(qs[i]).datepicker("option", $.datepicker.regional['de']);  
        // $(qs[i]).datepicker("option", $.datepicker.regional['FR']);
    } // Next i 
}

Ответ 6

Попробуйте следующее:

$('#datepicker').datepicker({
onSelect : function(x, u){
 $(this).focus(); 
   $(this).datepicker("hide");     
},
onClose: function(e){
e.preventDefault();
}
});

здесь скрипка http://jsfiddle.net/VZts7/69/

Или для IE8:

$('#datepicker').datepicker({
onSelect : function(x, u){
 $(this).focus();     
},
onClose: function(e){
(this).datepicker("hide");   
}
});

даже если это не идеальное решение, см. рабочий скрипт http://jsfiddle.net/hv77F/2/

Ответ 7

Решение для jQuery > 1.9 в IE <= 9

{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 = isIE ? !this.fixFocusIE : true;                      
              this.fixFocusIE = false;                      
              return result;
         }

function isIE() {
        var ua = window.navigator.userAgent;
        var msie = ua.indexOf("MSIE ");

        if (msie > 0)      
           return true;
        else                 

        return false;
    }