禁用jQuery UI的日期选择器回车键(Disable enter key in JQuery u

2019-07-19 17:27发布

似乎是与jQuery UI日期选择器,当用户手动输入一个日期的错误,并点击进入,在日期选择器关闭,但焦点始终在球场上,直到文本框失去焦点,并再次得到它为此日历不会再次打开。 我怎么可以禁止回车键的行为吗? 还是有这个看似已知的bug,任何其他已知的解决方案? 谢谢!

编辑

在这多一点的工作后,这是我想出了解决方案:

$('#someid').bind('keydown', function(event) {

    if (event.which == 13) {var e=jQuery.Event("keydown");
                    e.which = 9;//tab 
                    e.keyCode = 9;
                    $(this).trigger(e);
                    return false;
                }
            });

Tab键运作良好,并防止日期选择器的默认行为回车键事件像在某些情况下选择今天的日期。

Answer 1:

试试这个

$(document).keydown(keyDownHandler); // use appropriate selector for the keydown handler

function keyDownHandler(e) {
    if(e.keyCode === 13) {
        e.stopPropagation();
        e.preventDefault();

        return false;
    }
}

e.stopPropagation防止起泡, e.preventDefault防止默认行为,并返回false确实太少,我想。

你应该看看有什么效果最好: keyUpkeyDownkeyPress



Answer 2:

我最初有应用解决方案的问题。 我认为它值得张贴我的大片段,让多一点背景。

if (!Modernizr.inputtypes.date) {
    //use modernizer to weed out browsers that already have a timepicker 
    //http://stackoverflow.com/questions/11297827/html5-date-input-type-interfering-with-jquery-datepicker

    $("input[data-val-date]")
                    .bind('keydown', function (event) {  // BEGIN APPLYING NinaNa's S.O. ANSWER
                    if (event.which == 13) {
                        var e = jQuery.Event("keydown");
                        e.which = 9;//tab 
                        e.keyCode = 9;
                        $(this).trigger(e);
                        return false;
                    }
    }).datepicker({ dateFormat: 'mm/dd/yy' }); //THEN APPLY JQUERY UI FUNCTIONALITY


}


Answer 3:

通过添加模糊()事件的日期选择的的OnClose方法来解决。



Answer 4:

最简单的方法是实例的日期选择器上<input>像你通常会,但随后摆脱重点处理我们自己的,并与一个单击处理程序替换它。



Answer 5:

使用e.stopImmediatePropagation()并确保该keydown结合调用之前发生datepicker()

  $('input').on('keydown', function(e) {
      if (e.which == 13)
          e.stopImmediatePropagation();
  }).datepicker();

信用



文章来源: Disable enter key in JQuery ui datepicker