Dojo IconContainer不工作_Dojo_Dojox.mobile

Dojo IconContainer不工作

dojo

Dojo IconContainer不工作,dojo,dojox.mobile,Dojo,Dojox.mobile,我试图执行这个包含Dojo图标容器的简单HTML代码，但不知怎么的，它不起作用。有人能帮我找出我做错了什么吗？我使用的是Dojo1.7版 <!DOCTYPE HTML> <html> <head> <meta name="viewport" content="width=device-width,initial-scale=1,maximum- scale=1,minimum-scale=1,u

我试图执行这个包含Dojo图标容器的简单HTML代码，但不知怎么的，它不起作用。有人能帮我找出我做错了什么吗？我使用的是Dojo1.7版

    <!DOCTYPE HTML>
    <html>
    <head>
            <meta name="viewport" content="width=device-width,initial-scale=1,maximum-       scale=1,minimum-scale=1,user-scalable=no"/>
            <meta name="apple-mobile-web-app-capable" content="yes" />
            <title>Icon</title>


          <style>
                    .box {
                            border: 1px solid #A7C0E0;
                            width: 300px;
                            height: 250px;

                            background-color: white;
                    }
            </style> 
            <script type="text/javascript" src="dojo/dojo.js" djConfig="parseOnLoad:     true"></script>
              <script type="text/javascript" src="dojox/mobile/mobile-all.js" ></script>
            <script language="JavaScript" type="text/javascript">
                    //dojo.require("dojo.parser"); // Use the lightweight parser.
                    dojo.require("dojox.mobile.parser");
                    dojo.require("dojox.mobile");
                    dojo.require("dojox.mobile.IconContainer");
                    dojo.require("dojox.mobile.IconItem");
                    dojo.require("dojox.mobile.RoundRectCategory");
                    dojo.require("dojox.mobile.RoundRectList");
                    dojo.require("dojox.mobile.ListItem");
                    dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
            </script>
    </head>
    <body>
           <div id="foo" dojoType="dojox.mobile.View" selected="true">
                    <h1 dojoType="dojox.mobile.Heading">Icon Container</h1>
                    <ul dojoType="dojox.mobile.IconContainer">
                            <li dojoType="dojox.mobile.IconItem" label="app1" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                            <li dojoType="dojox.mobile.IconItem" label="app2" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                            <li dojoType="dojox.mobile.IconItem" label="app3" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                            <li dojoType="dojox.mobile.IconItem" label="moveTo" icon="images/icon.png" moveTo="about" transition="slide"></li>

                    </ul>
            </div> 

            <div id="about" dojoType="dojox.mobile.View">
                    <h1 dojoType="dojox.mobile.Heading" back="Icon Container" moveTo="foo">About</h1>
                    <h2 dojoType="dojox.mobile.RoundRectCategory">My Phone</h2>
                    <ul dojoType="dojox.mobile.RoundRectList">
                            <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                    Network                                                                                    
                            </li>                                                                                              
                            <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                    Line
                            </li>
                            <li dojoType="dojox.mobile.ListItem" rightText="1024">
                                    Songs
                            </li>
                    </ul>
            </div>
    </body>


偶像
.盒子{
边框：1px实心#A7C0E0；
宽度：300px；
高度：250px；
背景色：白色；
}
//require（“dojo.parser”）；//使用轻量级解析器。
require（“dojox.mobile.parser”）；
dojo.require（“dojox.mobile”）；
require（“dojox.mobile.IconContainer”）；
require（“dojox.mobile.IconItem”）；
require（“dojox.mobile.RoundRectCategory”）；
require（“dojox.mobile.RoundRectList”）；
require（“dojox.mobile.ListItem”）；
requireIf（！dojo.isWebKit，“dojox.mobile.compat”）；
图标容器






关于
我的电话


网络


线


歌曲

您可以通过以下方式使其正常工作：

需要dojox.mobile.deviceTheme才能加载小部件css

删除dojox/mobile/mobile-all.js脚本指令

这将为您提供以下源代码：

<!DOCTYPE HTML>
<html>
<head>
        <meta name="viewport" content="width=device-width,initial-scale=1,maximum-       scale=1,minimum-scale=1,user-scalable=no"/>
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <title>Icon</title>


      <style>
                .box {
                        border: 1px solid #A7C0E0;
                        width: 300px;
                        height: 250px;

                        background-color: white;
                }
        </style> 
        <script type="text/javascript" src="dojo/dojo.js" djConfig="parseOnLoad:     true"></script>
        <script language="JavaScript" type="text/javascript">
                //dojo.require("dojo.parser"); // Use the lightweight parser.
                dojo.require("dojox.mobile.deviceTheme");
                dojo.require("dojox.mobile.parser");
                dojo.require("dojox.mobile");
                dojo.require("dojox.mobile.IconContainer");
                dojo.require("dojox.mobile.IconItem");
                dojo.require("dojox.mobile.RoundRectCategory");
                dojo.require("dojox.mobile.RoundRectList");
                dojo.require("dojox.mobile.ListItem");
                dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
        </script>
</head>
<body>
       <div id="foo" dojoType="dojox.mobile.View" selected="true">
                <h1 dojoType="dojox.mobile.Heading">Icon Container</h1>
                <ul dojoType="dojox.mobile.IconContainer">
                        <li dojoType="dojox.mobile.IconItem" label="app1" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                        <li dojoType="dojox.mobile.IconItem" label="app2" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                        <li dojoType="dojox.mobile.IconItem" label="app3" icon="images/icon.png" lazy="true"><div class="box"></div></li>
                        <li dojoType="dojox.mobile.IconItem" label="moveTo" icon="images/icon.png" moveTo="about" transition="slide"></li>

                </ul>
        </div> 

        <div id="about" dojoType="dojox.mobile.View">
                <h1 dojoType="dojox.mobile.Heading" back="Icon Container" moveTo="foo">About</h1>
                <h2 dojoType="dojox.mobile.RoundRectCategory">My Phone</h2>
                <ul dojoType="dojox.mobile.RoundRectList">
                        <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                Network                                                                                    
                        </li>                                                                                              
                        <li dojoType="dojox.mobile.ListItem" rightText="AcmePhone">
                                Line
                        </li>
                        <li dojoType="dojox.mobile.ListItem" rightText="1024">
                                Songs
                        </li>
                </ul>
        </div>
</body>


偶像
.盒子{
边框：1px实心#A7C0E0；
宽度：300px；
高度：250px；
背景色：白色；
}
//require（“dojo.parser”）；//使用轻量级解析器。
require（“dojox.mobile.deviceTheme”）；
require（“dojox.mobile.parser”）；
dojo.require（“dojox.mobile”）；
require（“dojox.mobile.IconContainer”）；
require（“dojox.mobile.IconItem”）；
require（“dojox.mobile.RoundRectCategory”）；
require（“dojox.mobile.RoundRectList”）；
require（“dojox.mobile.ListItem”）；
requireIf（！dojo.isWebKit，“dojox.mobile.compat”）；
图标容器






关于
我的电话


网络


线


歌曲

是的，塞巴斯蒂安，我找到了答案，并且做了同样的事情，只增加了几行就解决了问题。。。。