Javascript 更改Dojox.Mobile.Heading的标签属性

我有一个dojox.mobile网站，它有一个共同的视图。我想为多个“按钮”重用视图，并调用一个函数，该函数根据按下的按钮更改视图标题的标签。但是，当我更改innerHTML时，后退按钮消失了。当我使用setattr函数时，标签不会改变。正确的处理方法是什么

    <div id="MainMenu" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true" style="width: 100%; height: 100%;">
        <h1 data-dojo-type="dojox.mobile.Heading">View A</h1>

        <h2 dojoType="dojox.mobile.RoundRectCategory">Select a View</h2>
        <ul data-dojo-type="dojox.mobile.RoundRectList">
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewA">
                View A
            </li>
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewB">
                View B
            </li>
        </ul>
    </div>

    <div id="generic_view_x" data-dojo-type="dojox.mobile.View" style="width: 100%; height: 100%;">
        <h1 id="view_x_header" data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Main', moveTo:'MainMenu',label:'test'"></h1>

            <div id="map_canvas"  style="width: 100%; height: 100%;">
                Some Other Stuff Here
            </div>


    </div>



    <!-- configure and load dojo -->
    <script src="./dojo/dojo.js" data-dojo-config="async:1, mblAlwaysHideAddressBar:true"></script>

    <script>

        require(["dojo"], function(dojo){

        SetupViewA = function (){
            // Doing it This way removes the back button
            // document.getElementById('view_x_header').innerHTML = 'View A';
            // This doesn't change anything
            dojo.setAttr("view_x_header", 'label','View A')

        }
        SetupViewB = function (){

                document.getElementById('view_x_header').innerHTML = 'View B';

        }


                })

        require(["dojox/mobile/parser", "dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat", "dojo/domReady!"],
                function(parser) {
                parser.parse();
                });


    </script>

</body>

--> 演示这个问题

    <div id="MainMenu" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true" style="width: 100%; height: 100%;">
        <h1 data-dojo-type="dojox.mobile.Heading">View A</h1>

        <h2 dojoType="dojox.mobile.RoundRectCategory">Select a View</h2>
        <ul data-dojo-type="dojox.mobile.RoundRectList">
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewA">
                View A
            </li>
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewB">
                View B
            </li>
        </ul>
    </div>

    <div id="generic_view_x" data-dojo-type="dojox.mobile.View" style="width: 100%; height: 100%;">
        <h1 id="view_x_header" data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Main', moveTo:'MainMenu',label:'test'"></h1>

            <div id="map_canvas"  style="width: 100%; height: 100%;">
                Some Other Stuff Here
            </div>


    </div>



    <!-- configure and load dojo -->
    <script src="./dojo/dojo.js" data-dojo-config="async:1, mblAlwaysHideAddressBar:true"></script>

    <script>

        require(["dojo"], function(dojo){

        SetupViewA = function (){
            // Doing it This way removes the back button
            // document.getElementById('view_x_header').innerHTML = 'View A';
            // This doesn't change anything
            dojo.setAttr("view_x_header", 'label','View A')

        }
        SetupViewB = function (){

                document.getElementById('view_x_header').innerHTML = 'View B';

        }


                })

        require(["dojox/mobile/parser", "dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat", "dojo/domReady!"],
                function(parser) {
                parser.parse();
                });


    </script>

</body>

查看A
选择一个视图


查看A


视图B


这里还有别的东西
require（[“dojo”]，function（dojo）{
SetupViewA=函数（）{
//这样做会删除“后退”按钮
//document.getElementById（'view_x_header'）。innerHTML='view A'；
//这不会改变任何事情
setAttr（“视图标题”、“标签”、“视图A”）
}
SetupViewB=函数（）{
document.getElementById（'view_x_header'）。innerHTML='view B'；
}
})
要求（[“dojox/mobile/parser”、“dojox/mobile”、“dojox/mobile/deviceTheme”、“dojox/mobile/compat”、“dojo/domReady！”），
函数（解析器）{
parser.parse（）；
});

---

对于小部件，如标题，最好使用其get/set来更改小部件的属性

    <div id="MainMenu" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true" style="width: 100%; height: 100%;">
        <h1 data-dojo-type="dojox.mobile.Heading">View A</h1>

        <h2 dojoType="dojox.mobile.RoundRectCategory">Select a View</h2>
        <ul data-dojo-type="dojox.mobile.RoundRectList">
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewA">
                View A
            </li>
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewB">
                View B
            </li>
        </ul>
    </div>

    <div id="generic_view_x" data-dojo-type="dojox.mobile.View" style="width: 100%; height: 100%;">
        <h1 id="view_x_header" data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Main', moveTo:'MainMenu',label:'test'"></h1>

            <div id="map_canvas"  style="width: 100%; height: 100%;">
                Some Other Stuff Here
            </div>


    </div>



    <!-- configure and load dojo -->
    <script src="./dojo/dojo.js" data-dojo-config="async:1, mblAlwaysHideAddressBar:true"></script>

    <script>

        require(["dojo"], function(dojo){

        SetupViewA = function (){
            // Doing it This way removes the back button
            // document.getElementById('view_x_header').innerHTML = 'View A';
            // This doesn't change anything
            dojo.setAttr("view_x_header", 'label','View A')

        }
        SetupViewB = function (){

                document.getElementById('view_x_header').innerHTML = 'View B';

        }


                })

        require(["dojox/mobile/parser", "dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat", "dojo/domReady!"],
                function(parser) {
                parser.parse();
                });


    </script>

</body>

你应使用：

    <div id="MainMenu" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true" style="width: 100%; height: 100%;">
        <h1 data-dojo-type="dojox.mobile.Heading">View A</h1>

        <h2 dojoType="dojox.mobile.RoundRectCategory">Select a View</h2>
        <ul data-dojo-type="dojox.mobile.RoundRectList">
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewA">
                View A
            </li>
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewB">
                View B
            </li>
        </ul>
    </div>

    <div id="generic_view_x" data-dojo-type="dojox.mobile.View" style="width: 100%; height: 100%;">
        <h1 id="view_x_header" data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Main', moveTo:'MainMenu',label:'test'"></h1>

            <div id="map_canvas"  style="width: 100%; height: 100%;">
                Some Other Stuff Here
            </div>


    </div>



    <!-- configure and load dojo -->
    <script src="./dojo/dojo.js" data-dojo-config="async:1, mblAlwaysHideAddressBar:true"></script>

    <script>

        require(["dojo"], function(dojo){

        SetupViewA = function (){
            // Doing it This way removes the back button
            // document.getElementById('view_x_header').innerHTML = 'View A';
            // This doesn't change anything
            dojo.setAttr("view_x_header", 'label','View A')

        }
        SetupViewB = function (){

                document.getElementById('view_x_header').innerHTML = 'View B';

        }


                })

        require(["dojox/mobile/parser", "dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat", "dojo/domReady!"],
                function(parser) {
                parser.parse();
                });


    </script>

</body>

 dijit.registry.byId("view_x_header").set("label", "View B");

---

小提琴：：

棒极了。谢谢，这就解决了。我以前试过dijit.byId，但没有成功。我想我指的是以前的DojoAPI？是的，dijit.byId是1.7之前的版本。他们将小部件查找移动到自己的名为registry的包中

    <div id="MainMenu" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true" style="width: 100%; height: 100%;">
        <h1 data-dojo-type="dojox.mobile.Heading">View A</h1>

        <h2 dojoType="dojox.mobile.RoundRectCategory">Select a View</h2>
        <ul data-dojo-type="dojox.mobile.RoundRectList">
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewA">
                View A
            </li>
            <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props="rightText:'Go!', moveTo: 'generic_view_x', callback:SetupViewB">
                View B
            </li>
        </ul>
    </div>

    <div id="generic_view_x" data-dojo-type="dojox.mobile.View" style="width: 100%; height: 100%;">
        <h1 id="view_x_header" data-dojo-type="dojox.mobile.Heading" data-dojo-props="back:'Main', moveTo:'MainMenu',label:'test'"></h1>

            <div id="map_canvas"  style="width: 100%; height: 100%;">
                Some Other Stuff Here
            </div>


    </div>



    <!-- configure and load dojo -->
    <script src="./dojo/dojo.js" data-dojo-config="async:1, mblAlwaysHideAddressBar:true"></script>

    <script>

        require(["dojo"], function(dojo){

        SetupViewA = function (){
            // Doing it This way removes the back button
            // document.getElementById('view_x_header').innerHTML = 'View A';
            // This doesn't change anything
            dojo.setAttr("view_x_header", 'label','View A')

        }
        SetupViewB = function (){

                document.getElementById('view_x_header').innerHTML = 'View B';

        }


                })

        require(["dojox/mobile/parser", "dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat", "dojo/domReady!"],
                function(parser) {
                parser.parse();
                });


    </script>

</body>