Всплывающее окно не отображается должным образом на мобильных устройствах

#jquery #html

#jquery #HTML

Вопрос:

я использую jquery mobile 1.4.2, я пытаюсь динамически создавать всплывающие окна на своей странице.Он отлично работает на компьютере, но если я открою ту же страницу на мобильном устройстве, она отобразится на секунду и погаснет. вот мой код

HTML

 <button id="yo1">Click</button>
 

jquery

 $(document).on('vclick','#yo1',function(){
var message = '<input name="im_user" type="text" class="valores" id="im_user"/><input name="im_password" type="password" class="valores" id="im_password" /><input name="inputAds" type="submit" id="inputAds" value="Ingresar" />',
   popupafterclose = '';
   runtimePopup(message, popupafterclose)


   });
 function runtimePopup(message, popupafterclose) {
  var template = "<div data-role='popup' class='ui-content messagePopup'>" 
    "<a href='#' data-role='button' data-theme='g' data-icon='delete' data-iconpos='notext' " 
    " class='ui-btn-right closePopup'>Close</a> <span> " 
    message   " </span> </div>";

      popupafterclose = popupafterclose ? popupafterclose : function () {};

      $.mobile.activePage.append(template).trigger("create");

     $.mobile.activePage.find(".closePopup").bind("tap", function (e) {
     $.mobile.activePage.find(".messagePopup").popup("close");
     });

    $.mobile.activePage.find(".messagePopup").popup().popup("open").bind({
          popupafterclose: function () {
             $(this).unbind("popupafterclose").remove();
          popupafterclose();
         }
          });
         }
 

ссылка на демонстрацию jsfiddle. Оно не отображается должным образом только на мобильных телефонах.На компьютере работает нормально.

Комментарии:

1. Вы знаете, что с версии V1.4 вы можете поместить разметку всплывающего окна за пределы любой страницы, верно?

Ответ №1:

Попробуйте добавить обновление после создания

 $.mobile.activePage.find(".messagePopup").popup("refresh");
 

после создания всплывающего окна.

Комментарии:

1. @user3350169 укажите это всплывающее окно с идентификатором или указанным классом и попробуйте код просто $(‘selector’).popup(); или $(‘selector’).popup(‘обновить’);…. также проверьте консоль на наличие ошибок

2. отображается ошибка, подобная ошибке: нет такого метода «обновить» для экземпляра всплывающего виджета