Question

我遇到一个问题，让jquery ui datepicker显示在jquery ui中可动态添加的元素，但仅限于Firefox。

选择其中一个可选项后，将创建一个动态创建的输入并将其附加到可选项。该输入在被动态添加到dom之前被指定为日期选择器。

我用我的问题示例创建了一个jsfiddle ...它在Chrome中运行良好，但Firefox不喜欢它。通过“不喜欢它”，我的意思是在选择其中一个可选标题后单击输入时，日期选择器不会显示。

这是我上面链接的jsfiddle的原始javascript：

$(document).ready(function(){
    $('.selectable').selectable({
        filter: 'li',
        cancel: 'input',
        stop: function(e, ui){
            var li = $(this).find('li');

            if (li.length > 0){
                $(li).each(function(){
                    if ($(this).hasClass('ui-selected')){
                        if ($(this).find('.start_date').length == 0){
                            var datepicker = $('<input/>').prop({'readonly': true}).datepicker({ minDate: 1 });

                            $('<div/>').attr({'class': 'start_date subtitle'})
                                .append($('<label/>').css({'display': 'inline-block'}).text('Start Date:'))
                                .append(datepicker)
                                .appendTo(this)
                        }
                    } else {
                        $(this).find('.start_date').remove();
                    }
                });
            } else {
                $(this).find('li div.start_date').remove();
            }
        }
    }).disableSelection();
});

由于

Answer 1

我认为问题是selectable行为正在吞噬其子项的鼠标事件，这会阻止日期选择器显示。尝试添加显式点击处理程序以显示选择器：

var datepicker = $('<input/>')
    .prop({'readonly': true})
    .datepicker({ minDate: 1 })
    .click(function(){ $(this).datepicker("show"); });

为什么jquery ui（v1.10.0）的datepicker在Firefox v18.0.1中不适用于我？

1 个答案: