使用Jquery的日期选择器在选择日期后失去焦点到文本框。

Question

使用Jquery的Datepicker在选择日期后失去焦点到文本框。我使用的是jquery-ui-1.9.2。当选择日期时，焦点不会进入文本框。任何解决方案？

Answer 1

在Doc Ready上初始化所有的datepckers

Answer 2

尝试使用下面的代码。

HTML代码：
<input type="text" id="date"/>

JQuery的：

$("#date").datepicker({ 
    onClose: function() { 
    $(this).focus(); 
    } 
}); 

JSFiddle1

编辑：上面的代码具有在IE中的问题，该日期选择器是没有得到关闭。在此blog中可以找到更多信息。

<script language='javascript' src="jquery-migrate-1.2.1.js"></script> // download and add this 

$("#date").datepicker({    
    /* fix buggy IE focus functionality */ 
    fixFocusIE: false, 
    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; 
    } 
}); 

JSFiddle2

Answer 3

$('.datepicker').datepicker(
    { 

     onClose: function() { 

     this.focus(); 
     } 
}); 

Answer 4

$(".datepicker").datepicker({ 
     onClose: function() { 
      $(this).parents().nextAll().find($(":input[type !='hidden']")).first().focus(); 

     } 
    }); 
}); 

我发现，将会把重点放在下一个输入，不管如何嵌套的它是一个更简单的方法。您可以随时将.find之后的条件替换为您喜欢的任何内容，并将重点放在此处。

Answer 5

普拉文的答案。 我有一个问题。在IE datepicker拒绝显示每个奇怪的时间我集中一个领域。

此外，这个解决方案存在一个轻微的逻辑问题（它不影响任何内容，但仍然不正确）：fixFocusIE字段正在选项上设置，但后来它被称为“this” ，当“this”引用DOM元素而不是选项对象时。所以基本上有两个fixFocusIE--一个在选项中（未使用），另一个在DOM元素本身。我不得不发明自己的IE探测器。

我工作的代码看起来像这样：

var el = $("selector of element I need to assign to datepicker"); 
var options = {}; // actually I fill options from defaults and do some other manipulations, but I left it as empty object here for brevity 

options.fixFocusIE = false; 

function detectIE() { 
    var ua = window.navigator.userAgent; 

    if(ua.indexOf('MSIE ') > 0 || 
     ua.indexOf('Trident/') > 0 || 
     ua.indexOf('Edge/') > 0) { 

     return true; 
    } 

    // other browser 
    return false; 
}  

/* blur() and change() are needed to update Angular bindings, if any */ 
options.onSelect = function(dateText, inst) { 
    options.fixFocusIE = true; 
    $(this).blur().change().focus(); 
}; 
options.onClose = function(dateText, inst) { 
    options.fixFocusIE = true; 
    this.focus(); 
}; 
options.beforeShow = function(input, inst) { 
    var result = detectIE() ? !options.fixFocusIE : true; 
    options.fixFocusIE = false; 
    return result; 
}; 

/* and this one will reset fixFocusIE to prevent datepicker from refusing to show when focusing the field for second time in IE */ 
el.blur(function(){ 
    options.fixFocusIE = false; 
}); 

el.datepicker(options);