12

仅在带有此代码的 IE 中

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

当我选择一个日期时,日期选择器会重新打开,因为我添加$(this).focus();onSelect. 我该如何解决这个问题?(

我正在使用 jquery 1.8.2 和 jquery-ui 1.9

4

7 回答 7

12

我今天遇到了这个问题,并为我提供了不同的解决方案。我的场景是我的 DatePicker 在一个 jQuery UI 对话框弹出窗口中。在 Chrome 中一切正常,但在 IE 中,日历总是会在选择日期后重新出现。

事实证明,在 jQuery 1.10.1 中有一个开放的错误:http: //bugs.jqueryui.com/ticket/9125

还有一个JSFiddle链接到它演示了 IE 中的错误。有两种方法可以让它在 IE 中工作:

  1. 设置modalfalse
  2. 选择日期后立即关注另一个元素

我选择了#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 });

希望这对将来的人有所帮助!

于 2013-09-23T16:22:16.263 回答
10

这是我能得到的最好的解决方法:

(受此链接启发)

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()});

请注意您在问题中的建议,我使用的是 jquery-UI 1.9.0。在您的示例中,您使用的是 jquery-ui 1.8.15,已知它在某些事件上存在错误(例如,IE 上的 beforeShow())。

于 2012-10-22T13:14:28.117 回答
5

我将它用于 IE,它也会停止日期选择器重新打开

查询:

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

HTML(对话框 div 的第一行):

<input class="ui-helper-hidden-accessible" id="focusfix" type="text"autofocus/>
于 2016-03-24T17:55:27.567 回答
3

由于.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()});
于 2013-12-18T09:35:14.770 回答
0

IE <= 9 中 jQuery > 1.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;
    }
于 2014-07-14T19:43:50.013 回答
0

尝试这个:

$('#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/

于 2012-10-22T12:40:35.257 回答
0

死灵术。
我有同样的问题,除了这里提到的答案都没有奏效。
这可能是因为我必须处理的代码适用于 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 
}
于 2017-06-01T14:32:37.740 回答