Fatal编程技术网
  • jquery/
  • 使用jquery mobile导航到多个页面

使用jquery mobile导航到多个页面

jquery jquery-mobile

使用jquery mobile导航到多个页面,jquery,jquery-mobile,Jquery,Jquery Mobile,我一直在使用jquerymobile在页面之间导航。我尝试了下面的代码 <body> <div data-role="page" id="home"> <div data-role="header"> <h1>site Details</h1> </div> <div data-role="content">

我一直在使用jquerymobile在页面之间导航。我尝试了下面的代码

<body>
    <div data-role="page" id="home">
        <div data-role="header">
            <h1>site Details</h1>
        </div>
        <div data-role="content">
            <a href="#Site entry1" data-role="button" data-inline="true">Enter the details of site</a>
            <a href="#Modify site" data-role="button" data-inline="true">Modify site details</a>
        </div>
    </div>
    <div data-role="page" id="Site entry1">
        <div data-role="header">
            <a href="#home" data-rel="back" data-role="button" data-icon="home">Home</a>
            <h1>Welcome To enter the details of site</h1>
        </div>
        <div data-role="content">
            <div class="content-primary">
                <form>
                <ul data-role="listview">
                    <li data-role="fieldcontain">
                        <label for="sitename">Site name:</label>
                        <input type="text" sitename="name" id="sitename" value="" />
                    </li>
                    <li data-role="fieldcontain">
                        <label for="siteno">Site name:</label>
                        <input type="text" siteno="siteno" id="siteno" value="" />
                    </li>
                    <a href="#Site entry2" data-role="button" data-inline="true">Next</a>
                </ul>
                </form>
            </div>
        </div>
        <div data-role="page" id="Site entry2">
            <div data-role="header">
                <a href="#Site entry1" data-role="button" data-icon="arrow-l">previous</a>
            </div>
            <div data-role="content">
                <div class="content-primary">
                    <form>
                    <ul data-role="listview">
                        <li data-role="fieldcontain">
                            <label for="moduleno">name:</label>
                            <input type="text" modulename="moduleno" id="moduleno" value="" />
                        </li>
                        <li class="ui-body ui-body-b">
                            <fieldset class="ui-grid-a">
                                <div class="ui-block-b">
                                    <button type="submit" data-theme="a">Submit</button></div>
                            </fieldset>
                        </li>
                    </ul>
                    </form>
                </div>
                <div data-role="footer">
                    <a href="#Site entry3" data-role="button" data-icon="arrow-r">Next</a>
                </div>
            </div>
            <div data-role="page" id="Site entry3">
                <div data-role="header">
                    <a href="#Site entry2" data-rel="back" data-role="button" data-icon="arrow-l">previous</a>
                </div>
                <div data-role="content">
                    <div class="content-primary">
                        <form>
                        <ul data-role="listview">
                            <li data-role="fieldcontain">
                                <label for="modulename">name:</label>
                                <input type="text" name="name" id="name" value="" />
                            </li>
                            <li class="ui-body ui-body-b">
                                <fieldset class="ui-grid-a">
                                    <div class="ui-block-b">
                                        <button type="submit" data-theme="a">Submit</button></div>
                                </fieldset>
                            </li>
                        </ul>
                        </form>
                    </div>
                    <div data-role="footer">
                        <a href="#home" data-role="button" data-icon="home">Home</a>
                    </div>
                </div>
                <div data-role="page" id="Modify site">
                    <div data-role="header">
                        <a href="home" data-rel="back" data-role="button" data-icon="home">Home</a>
                        <h1>List of sites </h1>
                    </div>
                    <div data-role="content"></div>
                    <div data-role="footer"></div>
                </div>
</body>


站点详细信息
欢迎输入网站的详细信息

    

  • 
网站名称：

    • 

  • 
网站名称：

    • 



    

  • 
姓名：

    • 

  • 
提交

    • 



    

  • 
姓名：

    • 

  • 
提交

    • 


地点清单
但我无法从站点条目1页面导航到站点条目2，也无法从主屏幕中的“修改”按钮导航到受尊重的页面。我需要将数据从站点条目页面1保存到站点条目页面3，直到我按下“提交”按钮

提前感谢。



<body>
 <div data-role="page" id="home">
<div data-role="header">
<h1>site Details</h1>
</div>

<div data-role="content">

<a href="#Site entry1" data-role="button" data-inline="true">Enter the details of site</a>

<a href="#Modify site" data-role="button" data-inline="true">Modify site details</a>

</div>

 </div>

<div data-role="page" id="Site entry1">

<div data-role="header">
    <a href="#home" data-rel="back" data-role="button" data-icon="home">Home</a>
    <h1>Welcome To enter the details of site</h1>
    </div>


<div data-role="content">
    <div class="content-primary">
    <form>
    <ul data-role="listview">
        <li data-role="fieldcontain">
            <label for="sitename">Site name:</label>
            <input type="text" sitename="name" id="sitename" value=""  />
        </li>
        <li data-role="fieldcontain">
            <label for="siteno">Site name:</label>
            <input type="text" siteno="siteno" id="siteno" value=""  />
        </li>

        <a href="#Site entry2" data-role="button" data-inline="true">Next</a>

    </ul>

    </form>
    </div>


</div>
</div>

<div data-role="page" id="Site entry2">

    <div data-role="header">
    <a href="#Site entry1"  data-role="button" data-icon="arrow-l">previous</a>
    </div>


    <div data-role="content">
        <div class="content-primary">
        <form>
        <ul data-role="listview">
            <li data-role="fieldcontain">
                <label for="moduleno">name:</label>
                <input type="text" modulename="moduleno" id="moduleno" value=""  />
            </li>
            <li class="ui-body ui-body-b">
                <fieldset class="ui-grid-a">
                        <div class="ui-block-b"><button type="submit" data-theme="a">Submit</button></div>
                    </fieldset>
            </li>

        </ul>

        </form>
        </div>
    </div>
    <div data-role="footer">
    <a href="#Site entry3" data-role="button" data-icon="arrow-r">Next</a>
    </div>


</div>

<div data-role="page" id="Site entry3">

    <div data-role="header">
    <a href="#Site entry2" data-rel="back" data-role="button" data-icon="arrow-l">previous</a>
    </div>


    <div data-role="content">
        <div class="content-primary">
        <form>
        <ul data-role="listview">
            <li data-role="fieldcontain">
                <label for="modulename">name:</label>
                <input type="text" name="name" id="name" value=""  />
            </li>

            <li class="ui-body ui-body-b">
                <fieldset class="ui-grid-a">
                        <div class="ui-block-b"><button type="submit" data-theme="a">Submit</button></div>
                    </fieldset>
            </li>

        </ul>

        </form>
        </div>
    </div>
    <div data-role="footer">
    <a href="#home"  data-role="button" data-icon="home">Home</a>
    </div>

</div>

<div data-role="page" id="Modify site">

    <div data-role="header">
    <a href="home" data-rel="back" data-role="button" data-icon="home">Home</a>
    <h1>List of sites </h1>
    </div>

    <div data-role="content">
    </div>

    <div data-role="footer">
    </div>
</div>


站点详细信息
欢迎输入网站的详细信息

    

  • 
网站名称：

    • 

  • 
网站名称：

    • 



    

  • 
姓名：

    • 

  • 
提交

    • 



    

  • 
姓名：

    • 

  • 
提交

    • 


地点清单
正确的代码

您没有正确关闭分区。ID不应该用空格分隔，它应该是一个单词且唯一。使用连字符、下划线或只是将它们粘在一起。如果页面id为，@Omar并不重要。它仍然可以工作。问题在于没有正确关闭分区，我在下面给出的代码中更正了这一点。