logo标签列表

jQuery Mobile Phonegap iOS：当我弹出键盘时，标题栏闪烁

htmljquery-mobilecordova
4

标题已经概括了要点。我通过以下方式拥有一个固定的持久化头部：

<div data-role="header"  data-id="headerbar" data-position="fixed" data-theme="b">

            <h1>Title!</h1>  
            <a href="#" class="ui-btn-right">Login</a> 
        </div>

然后可以通过以下方式添加另一个标题:

<div data-role="header"  data-theme="c">
        <h6>1. Type a name </h6> 
        <input type="search" name="name" id="basic" value=""></input>
    </div>

当我在xcode模拟器（或者我的实际iPhone）上单击文本输入时，第一个标题会变成纯白色，然后再恢复为正确的颜色。有什么想法吗？
我的屏幕看起来像这样：Sim Screen
你打算在同一页中使用两个头文件吗？ - uday
你能贴一下你屏幕的截图吗？ - uday
@JoshDG 你在这方面有进展吗？我遇到了类似的问题，固定头部中的搜索输入框会在键盘出现/消失时闪烁。虽然不是致命问题，但确实很烦人。 - Jeemusu
3个回答
2
您可以使用<label>代替<header>。
<label for="search-basic">Select Name:</label>
<input type="search" name="search" id="searc-basic" value="" data-mini="true" />

http://jsfiddle.net/6Vu4r/3/

编辑：这个属性是jQuery Mobile的data-position="fixed"。它的作用是当屏幕滚动时，隐藏工具栏。同样地，如果您点击屏幕，它会消失，再次点击时则会显示工具栏。因此，如果您单击了头部（工具栏）并且它第一次消失了，则再次单击它将会弹出来。如果不需要，请删除该属性。希望对您有所帮助。

这确实有助于我的格式，但另一个标题（顶部的那个）仍然闪烁。 - JoshDG
请看我的编辑。你让我感到困惑，因为你说“变成纯白色”并称之为“闪烁效果”。 - uday
嗯......好的，那个确实解决了问题，所以我接受了回答，但是我希望它成为一个固定的标题......我不希望它在滚动时移动。我能做到吗？顺便感谢你的帮助 :) - JoshDG
1
好的，就使用默认的 data-role="header" 和 data-role="footer"。在这种情况下，页眉和页脚会显示在页面顶部和页面内容（文本）的底部，而不是屏幕底部。我不知道是否让您感到困惑。正如我所说，这总是取决于您页面的需求（您在页面中放置文本的长度）。您需要在其中进行一些试验，以便更好地掌握这些事情。 :) - uday
是的，也许我不太理解你的意思，但我肯定需要更多的实践来掌握它。我的意思是，我正在将它作为一个应用程序使用，所以我真的不希望标题随着页面滚动而滚动。如果我不将其固定，它就会这样做。有没有办法在屏幕被点击或滚动时不使固定栏消失？ - JoshDG
据我所知，没有默认的方法，但您可以使用自己的自定义函数来实现。简单地说，我在之前的评论中想要表达的是，如果您有默认页脚，它将始终显示在您的文本右侧，可能不在页面底部，而可能在页面结束的地方的中心或其他位置，但页眉始终保持在页面顶部。放置一些100行文本并使用这些工具栏属性进行操作，这不是一个大任务，只需要几分钟即可完成。 - uday
2

正如@uDaY所说，删除data-position="fixed"可以帮助我摆脱@uDay的编辑中提到的问题。在div data-role="header"中，您可以尝试使用style="position:fixed"并重新对齐，如果看到任何对齐变化，则可以使标题固定。 :) 感谢您的解决方案和问题。

对我来说，当我删除 data-position 只留下 style 时，对齐就会丢失。因此，我保留了 data-position 并添加了 style：<div id="evento_header" data-role="header" data-position="fixed" style="position:fixed">...</div> - reinaldoluckman
0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接