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>

在谷歌浏览器中，当用户点击背景时，页脚会消失。当用户再次单击背景时，将显示页脚。为什么？这是故意的吗？

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（）方法。从jquery 1.7开始，on方法是新的。建议在.live（）之上使用.delegate（），所以这样做：

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

Answer 2

简单的解决方案是在标题中添加以下属性：

data-tap-toggle="false"

......框架将为您处理。

有关详细信息，请参阅Toolbar Widget's tapToggle option。

为什么我的jQuery Mobile页脚会出现，然后在用户点击背景时消失？

2 个答案: