1

選択可能なjqueryui内の動的に追加された要素にjqueryuidatepickerを表示するのに問題がありますが、Firefoxでのみです。

選択可能なものの1つが選択されると、動的に作成された入力が作成され、選択可能なものに追加されます。その入力は、動的にDOMに追加される前に、日付ピッカーとして割り当てられます。

問題の例を使用してjsfiddleを作成しました...Chromeでは正常に動作しますが、Firefoxはそれを好みません。「気に入らない」とは、選択可能なタイトルの1つを選択した後、入力をクリックしても日付ピッカーが表示されないことを意味します。

これが私が上にリンクした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();
});

ありがとう

4

1 に答える 1

2

selectable問題は、動作が子のマウスイベントを飲み込んでいるため、日付ピッカーが表示されないことだと思います。明示的なクリックハンドラーを追加して、ピッカーを表示してみてください。

var datepicker = $('<input/>')
    .prop({'readonly': true})
    .datepicker({ minDate: 1 })
    .click(function(){ $(this).datepicker("show"); });
于 2013-01-31T19:41:03.320 に答える