在 Jquery mobile 中，在页面内单击时，页眉和页脚总是隐藏？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6925246/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
In Jquery mobile, Header and footers are always hiding, when clicking inside the page?
提问by sadeesh kumar
I need, header and footer always fixed position.
我需要，页眉和页脚总是固定的位置。
I don't want like the below url page. What will i do?. Help me........ http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/toolbars/bars-fullscreen.html
我不想像下面的网址页面。我该怎么办？。帮帮我........ http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/toolbars/bars-fullscreen.html
(In the above url, if u clicked inside the page. The header and footer will hide). I don't want like this
（在上面的网址中，如果您在页面内单击。页眉和页脚将隐藏）。我不想这样
回答by ahren
If anyone still finds this question and realises the above no longer works, like I did, the correct way to do it (which is correct today, 23/May/2012) is now:
如果有人仍然发现这个问题并意识到上述不再有效，就像我所做的那样，正确的方法（今天是正确的，23/May/2012）现在是：
<div data-role="footer" data-position="fixed" data-tap-toggle="false">
<div data-role="footer" data-position="fixed" data-tap-toggle="false">
回答by fjsj
Use data-tap-toggle="false"AND data-hide-during-focus="".
使用data-tap-toggle="false"AND data-hide-during-focus=""。
The second one will prevent fixed toolbars from hiding when you click an input.
第二个将防止固定工具栏在您单击输入时隐藏。
回答by LeftyX
I managed to do it using a fixed footer:
我设法使用固定页脚来做到这一点：
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
and some javascript:
和一些javascript：
<script type="text/javascript">
$('#containerPage').live('pagecreate', function (event) {
$.fixedToolbars.setTouchToggleEnabled(false);
});
</script>
where #containerPageis my main page:
#containerPage我的主页在哪里：
<div data-role="page" id="containerPage" data-fullscreen="true">
..
</div>
I've tried and tested this solution with jQuery Mobile v1.0rc1. downloaded October, 13th 2011
我已经使用 jQuery Mobile v1.0rc1 尝试并测试了这个解决方案。2011 年 10 月 13 日下载
回答by Foo JH
data-tap-toggle="false"saved me the same headache!
data-tap-toggle="false"救了我同样的头痛！
It's a good feature. I'm surprised I missed it in the docs.
这是一个很好的功能。我很惊讶我在文档中错过了它。
回答by Stancho Stanchev
data-tap-toggle="false" works ok with jQueryMobile 1.1.0 and PhoneGap 2.2.0
data-tap-toggle="false" 适用于 jQueryMobile 1.1.0 和 PhoneGap 2.2.0
回答by omgz0r
I realize this question is dated, however it didn't help me 100%. Below is the solution I came to after some refined googling, decided to post it here as this was my first result.
我意识到这个问题已经过时了，但是它并没有 100% 帮助我。以下是我经过一些精细的谷歌搜索后得出的解决方案，决定将其发布在这里，因为这是我的第一个结果。
My problem was that the header and footer would hide when tapping an input, regardless of whether the default behaviour was used. I was using the amazing DateBox.
我的问题是，无论是否使用默认行为，点击输入时页眉和页脚都会隐藏。我正在使用令人惊叹的 DateBox。
Manually updating the DOM header/footer with data-tap-toggle='false' didn't do anything, but this would have saved me some time:
使用 data-tap-toggle='false' 手动更新 DOM 页眉/页脚并没有做任何事情，但这可以为我节省一些时间：
$("[data-role=header]").fixedtoolbar({ tapToggleBlacklist: "input[data-role=datebox]" });
$("[data-role=footer]").fixedtoolbar({ tapToggleBlacklist: "input[data-role=datebox]" });
For whatever reason, disabling tap toggles this way solved my issue as well as showing me a short-hand for disabling it across a large number of pages.
无论出于何种原因，以这种方式禁用点击切换解决了我的问题，并向我展示了在大量页面上禁用它的简写。
回答by M'hammad M'ssabeh
data-hide-during-focus=""is only for the input type which need focus,if you click anywhere in the page and the problem happen then you need to use data-tap-toggle="false". put this only in the fixed position div
data-hide-during-focus=""仅适用于需要焦点的输入类型，如果您单击页面中的任意位置并发生问题，则需要使用data-tap-toggle="false". 把这个只放在固定位置的div
<div data-role="footer" data-position="fixed"
data-tap-toggle="false" data-hide-during-focus="" data-theme="b"></div>
回答by Tripex
I'm using data-hide-during-focus="", It's working now!
我正在使用data-hide-during-focus=""，它正在工作！
