Почему мой нижний колонтитул jQuery Mobile появляется, а затем исчезает, когда пользователь нажимает фон?

Question

У меня есть нижний колонтитул на моем сайте jQuery Mobile.

<div data-role="footer" data-position="fixed">
    <div data-role="navbar">
        <ul>
            <li><a href="/page1">Page 1</a></li>
            <li><a href="/logout">Logout</a></li>
        </ul>
    </div>
</div>

В Google Chrome, когда пользователь нажимает на фон, нижний колонтитул исчезает.Когда пользователь снова нажимает на фон, появляется нижний колонтитул.Зачем?Это преднамеренная особенность?

Answer 1

По умолчанию это включено.Вот некоторый код для его отключения в JQM v 1.1-RC1

$(document).on('pageinit','[data-role=page]', function(){
    $('[data-position=fixed]').fixedtoolbar({ tapToggle:false});
});

. Мне нравится привязывать его к событию taphold.Это имеет больше смысла для меня.Вот как это сделать:

$(document).on('taphold', '[data-role=page]', function(){
    $('[data-position=fixed]').fixedtoolbar('toggle');
});

Если вы используете JQM v 1.0.1, вы не можете использовать метод .on ().Метод on является новым с jquery 1.7.Использование .delegate () рекомендуется вместо .live (), поэтому сделайте следующее:

$(document).delegate('[data-role=page]','pageinit', function(){
    $.mobile.fixedToolbars.setTouchToggleEnabled(false);
});

Answer 2

Простое решение заключается в добавлении следующего атрибута в заголовок:

data-tap-toggle="false"

... и рамки позаботятся об этом за вас.

Для получения дополнительной информации см. Параметр tapToggle виджета панели инструментов .