JQuery UI DatePicker не исчезает при нажатии на IOS снаружи - PullRequest
Новая
       12

JQuery UI DatePicker не исчезает при нажатии на IOS снаружи

0 голосов
/ 23 января 2019

Я добавил jquery datepicker на мой сайт PHP.DatePicker не исчезает при нажатии на IOS снаружи.Он отлично работает на рабочем столе.Кто-нибудь сталкивался с этой проблемой?

Ответы [ 2 ]

0 голосов
/ 08 марта 2019

Я использовал это решение, вероятно, не лучшее, но оно работает для меня. Обратная связь приветствуется

CSS: 

#backdrop {visibility:hidden;z-index: 5;position:fixed;background-color:#000;height:100%;width:100%;top:0px;left:0px;margin:0px;padding:0px;}

отрегулируйте z-index до соответствующего значения, гарантируя, что #backdrop (если оно не скрыто) находится перед другими элементами, а Datepicker является самым высоким в порядке стека

JQuery: 

$jq('#elementid').datepicker({
            beforeShow: function(){
                if (navigator.userAgent.match(/(iPod|iPhone|iPad)/) && !window.MSStream) {
                   if ($('backdrop') == null) {
                        var screen = new Element('div', {'id': 'backdrop'});
                        document.body.appendChild(screen);
                   }
                   Event.observe('backdrop', 'click', function() {
                        $jq("$jq('#elementid').").datepicker("hide");
                   });
                   $jq('#backdrop').css({'visibility': 'visible', 'opacity': '0'}); //adjust visible opacity if required
            },
            onClose: function(){
                if ($('backdrop') != null) {
                        $jq('#backdrop').css({'visibility': 'hidden', 'opacity': '0'});
                   }
            }
});
0 голосов
/ 23 января 2019

У ваших сборщиков дат есть класс hasDatepicker, поэтому попробуйте это: 

$(".hasDatepicker").blur(function(e) { $(this).datepicker("hide"); });

это относительно мало по сравнению с альтернативными способами, о которых я думал. 

$(document).click(function(e) { 
   var ele = $(e.toElement); 
   if (!ele.hasClass("hasDatepicker") && !ele.hasClass("ui-datepicker") && !ele.hasClass("ui-icon") && !$(ele).parent().parents(".ui-datepicker").length)
   $(".hasDatepicker").datepicker("hide"); 
});

проблема, с которой я столкнулся, была в состояниичтобы сказать, когда щелкали по значку span, на самом деле не было желания сотрудничать, поэтому у дополнительного есть проверки классов

...