2

我在fancybox.

问题来自于fancybox覆盖div包含结果的框。自动完成工作正常，但结果在后面（不可见）返回fancybox

我怎样才能解决这个问题？

$('#calendar-wrapper').on('click','#calendar td[data-day]',function(){
            $.fancybox({href: '#newapp', title : 'New appointment'  });
            $("#newapp input[name='app_time']").val($(this).closest('tr').attr('data-hr')+':00:00');
            $("#newapp input[name='app_date']").val($(this).attr('data-day'));
        });////END OF FANCYBOX TRIGGER
     var cache = {};
    $(".ac").on('keyup.autocomplete', function(){
        var fun = $(this).attr("data-ac");
        var par=$(this).closest('FIELDSET');
        var el=$(this);
        par.find('input').not(this).val('');
        par.find('select option:selected').removeAttr('selected');
        $(this).autocomplete({
            minLength: 2,
            source: function( request, response ) {
                var term = request.term,baseurl='<?=base_url()?>';
                if ( term in cache ) {
                response( cache[ term ] );
                return;
                }
                var url=baseurl+'ajax/ac/'+fun+'/'+encodeURIComponent(term);
                $.getJSON( url, '', function( data, status, xhr ) {
                cache[ term ] = data;
                response( data );
                }).complete(function() {$('.ui-autocomplete-loading').removeClass('ui-autocomplete-loading'););
            },
            select: function(event, ui){
                for (var key in ui.item) 
                {
                var obj = ui.item[key];
                var f=par.find('[name*="'+key+'"]').first();
                if(f.length){
                    if(f.tagName == 'select'){
                        f.find('option[value="'+obj+'"]').first().attr('selected','selected');
                    }else{
                        f.val(obj);
                    }
                }
                }
            },
            messages: {noResults: '',results: function() {}}
        }); 
    });////END OF AUTOCOMPLETE

如何更改div包含jquery-ui-ac结果的 z-index 以将它们显示在fancybox?

4

4 回答 4

3

我用过这个，它对我有用。

<style>
     .ui-autocomplete.ui-front.ui-menu.ui-widget.ui-widget-content.ui-corner-all {
         z-index: 10000 !important;
     }
</style>
于 2013-07-09T14:19:41.580 回答
2

我面临同样的问题

尝试

open: function(){
           $(this).autocomplete('widget').css('z-index', 999999);
           return false;
       },
于 2014-02-20T09:10:33.483 回答
0

这足以解决问题（使用 fancybox 2.1.5、jquery-ui 1.11.4 测试）：

.ui-autocomplete {
    z-index: 10000 !important;
}
于 2015-05-19T10:02:34.123 回答
0

添加

'create': function(){$(".ui-autocomplete").css("z-index",100000);}

到自动完成

$("#pagelink").autocomplete({
        'source':'includes/loadvals-sql-ajax.php?table=Categories',
        'minLength': 3,
        'create': function(){$(".ui-autocomplete").css("z-index",100000);}
        });
于 2020-02-05T06:44:57.177 回答