Как получить уведомление, чтобы появиться только один раз в jQuery Mobile на нескольких страницах HTML - PullRequest
Новая
       0

Как получить уведомление, чтобы появиться только один раз в jQuery Mobile на нескольких страницах HTML

1 голос
/ 21 октября 2011

У меня есть многостраничный html (использующий "div data-role =" page "), который отображает 4 страницы документа, которые можно перемещать влево или вправо для перемещения между страницами назад и вперед.

Iу меня есть предупреждение, которое я хочу, чтобы всплывающее окно появлялось только при первой загрузке страницы (сообщая пользователю, что он может проводить пальцем для перемещения назад и вперед между страницами).

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

Я пытался переместить скрипт из головы внутрь элемента и пытался привязать его квсе различные события создания страниц, создания страниц, создания страниц и т. д., и я не могу их понять.

Я ценю любые советы или указания.

Вот код предупреждения, который в настоящее время отображается накаждая страница при просмотре: 

<script type="text/javascript"> 
 $('div').live("pagecreate",function(event){
alert('Swipe left and right to move between the 5 pages of this lead sheet');
});
</script>

Ответы [ 2 ]

0 голосов
/ 21 октября 2011

Вы можете привязать идентификатор к странице DIV (например, div # home). 

<script type="text/javascript">
    $('div#home').live("pagecreate", function (event) {
        alert('Swipe left and right to move between the 5 pages of this lead sheet');
    });
</script>

... 

<div data-role="page" id="home">
0 голосов
/ 21 октября 2011

Live Пример:

JS 

var $alerted = false;

$('div').live('pageshow',function(event, ui) {
    // Check for secure token here
    if($alerted == false) {
        $alerted = true;
        alert('Can you see me now?');
    }
});

HTML 

<div data-role="page" id="home">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">Alert once</li>
            <li><a href="#alert">Alert Page</a></li>
        </ul>
    </div>
</div>

<div data-role="page" id="alert">
    <div data-role="content">
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li data-role="list-divider">The Alert</li>
            <li><a href="#home">Home</a></li>
        </ul>
    </div>
</div>
...