在引导模式下的日期选择器中进行月份选择在Firefox中不起作用 [英] Month select in datepicker inside a bootstrap-modal won't work in Firefox

查看:94
本文介绍了在引导模式下的日期选择器中进行月份选择在Firefox中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如果日期选择器中的月份在引导模式内,则在FireFox中不起作用.

The month select in the datepicker doesn't work in FireFox if it is within a bootstrap-modal.

<button class="btn" id="btn">Click Me</button>

<div class="modal hide" id="modal" tabindex="-1">
    <div class="modal-body">
        <input type="text" id="datepicker" />        
    </div>
</div>

JavaScript:

JavaScript:

$("#datepicker").datepicker({"changeMonth": true});

$('#btn').click(function() {
    $("#modal").modal('show');
});

这是一个缩小的示例: http://jsfiddle.net/nKXF2/

Here is a minified example: http://jsfiddle.net/nKXF2/

我发现了类似的twitter-bootstrap github问题: https://github.com/twbs/bootstrap/issues/5979

I found a simmilar twitter-bootstrap github issue: https://github.com/twbs/bootstrap/issues/5979

推荐答案

我发现了两个针对此错误的修复程序:

I found two fixes for this bug:

修正1::如果您在div.modal中删除tabindex attr,则月份选择就可以了. 此解决方案的唯一问题是,在IE(任何版本)上,您仍然需要双击月份下拉菜单才能打开它.

Fix 1: If you remove the tabindex attr in div.modal, the month select works just fine. The only issue I had with this solution is that, on IE (any version) you still need to double-click the month dropwdown for it to open up.

修复2:您可以在以下位置找到第二种解决方案: http://jsfiddle. net/nKXF2/1/通过覆盖 <还可以通过strong>这个问题 来使月份下拉列表再次生效.

Fix2: The second solution you can find at: http://jsfiddle.net/nKXF2/1/ By overriding the enforceFocus function which was proposed in this question also, you get the month dropdown to work again.

$('#modal').on('show', function () {
    $.fn.modal.Constructor.prototype.enforceFocus = function () { };
});

我认为第二个是最好的.

I think this second one is the best.

这篇关于在引导模式下的日期选择器中进行月份选择在Firefox中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆