18
回答
jQuery Mobile 的导航栏(navbar)在我的浏览器无法正常显示!
终于搞明白,存储TCO原来是这样算的>>>   

这是在jQueryMobile a4中文手册关于导航栏,为什么我的浏览器无法正常显示?

 

 

====================================================

我的浏览器的显示效果

 

 

 

 

<div data-role="page">
        <div data-role="header" data-position="inline">
            <a href="jQueryTest.htm" data-icon="delete">Cancel</a>
            <h1>
                Edit Contact</h1>
            <a href="jQueryTest.htm" data-icon="check">Save</a>
        </div>

        <div data-role="content" data-theme="a">
            <div data-role="navbar">
                <ul>
                <li><a href="a.html" class="ui-btn-active">One</a></li>
                <li><a href="b.html">Two</a></li>
               </ul>
            </div>
        </div>

        <div data-role="footer">
            <h5>this is footer</h5>
        </div>
    </div>

各们大牛帮看下是什么回事?
举报
fujet
发帖于6年前 18回/7K+阅
共有18个答案 最后回答: 2年前

我测试了你的代码在我本地也不行,但我找到原因,你文件中的那些空格有问题,你试着把navbar中所有节点间的空格都删除,然后重新编排。

--- 共有 1 条评论 ---
Midnight小编辑威武! 6年前 回复

引用来自“小编辑”的答案

navbar 元素应该放在 header 里头,可以有两个 header

可是还是不行的啊 我无语了

<div data-role='header'><h1>,.....</h1></div>

<div data-role='header'><div data-role='navbar'><ul><li>....</li></ul></div></div>

应该这样放

引用来自“小编辑”的答案

<div data-role='header'><h1>,.....</h1></div>

<div data-role='header'><div data-role='navbar'><ul><li>....</li></ul></div></div>

应该这样放

还是不行的

 

引用来自“小编辑”的答案

<div data-role='header'><h1>,.....</h1></div>

<div data-role='header'><div data-role='navbar'><ul><li>....</li></ul></div></div>

应该这样放

我以为是我的游览问题,为此我下载了最新的chrome,可是还是不行

你看看oschina的移动首页吧 http://m.oschina.net/

html代码已经没问题了,是不是引入的css之类的有问题呢

引用来自“小编辑”的答案

你看看oschina的移动首页吧 http://m.oschina.net/

html代码已经没问题了,是不是引入的css之类的有问题呢

我的js 和css 都是在官方下载的

这应该不会有什么问题吧

 

--- 共有 2 条评论 ---
fujet@红薯 : 我快疯了:引用官方也是不行的啊 6年前 回复
红薯没问题的,你也可以直接引用官方的js和css文件,无需下载到本地 6年前 回复
<!DOCTYPE html> 
<html> 
<head> 
 <title>Page Title</title> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
</head> 
<body> 
<div data-role="page">
    <div data-role="header">
        <div data-role="navbar">
       <ul>
        <li><a href="a.html" class="ui-btn-active">One</a></li>
        <li><a href="b.html">Two</a></li>
       </ul>
    </div><!-- /navbar -->
    </div>
    <div data-role="header">
        <div data-role="navbar">
       <ul>
        <li><a href="a.html" class="ui-btn-active">One</a></li>
        <li><a href="b.html">Two</a></li>
       </ul>
    </div><!-- /navbar -->
    </div>
</div>

</body>
</html>

引用来自“小编辑”的答案

你看看oschina的移动首页吧 http://m.oschina.net/

html代码已经没问题了,是不是引入的css之类的有问题呢

你好,你还在不?

要不你把楼上的代码在你电脑是运行一下,看正常不

- -

顶部