Отображение всплывающего окна в мобильном телефоне JQuery

0

Я использую JQuery mobile, и я пытаюсь отобразить всплывающее окно, но всплывающее окно просто не отображается. Вот что я пытался сделать до сих пор:

document.addEventListener("menubutton", function(){
    var template = $("<div data-role='popup' id='menu-option' "
        + "data-overlay-theme='a'>"
        + "<ul data-role='listview' data-inset='true' "
        + "style='min-width:210px;' data-theme='d'>"
        + "<li data-role='divider' data-theme='e'>Options</li>"
        + "<li><a>Setting</a></li>"
        + "<li><a>Refresh</a></li>"
        + "<li><a>Help</a></li>"
        + "<li><a>about</a></li>"
        + "<li><a id='exit-app'>Exit App</a></li>"
        + "</ul> </div>");


    template.appendTo($.mobile.pageContainer);                     
    template.popup();
    template.popup('open');

    }, false);
  • 0
    Какое устройство вы пытаетесь? Событие menubutton поддерживается не на всех устройствах.
Теги:
cordova
jquery-mobile

1 ответ

0

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

// append it to active page or a specific #page
template.appendTo($.mobile.activePage);

// create it and then open it
$("[data-role=popup]").popup().trigger("create").popup('open');

демонстрация

Ещё вопросы

Сообщество Overcoder
Наверх
Меню