如何在单个 jQuery 移动文档中包含多个页面？

在本文中，我们将学习如何在单个 jQuery 移动文档中包含多个页面。

方法：这可以通过创建多个 div 并将data-role属性设置为page来实现，现在每个 div 将代表一个页面，并且每个 div 需要有一个唯一的 id 以便在页面之间正确链接。 jQuery Mobile页面结构经过优化以支持单个页面或单个页面内的本地内部链接“页面”。

CDN 链接：

步骤：首先，将 jQuery CDN 添加到脚本或将它们下载到本地计算机。我们将创建一个包含 2 页的文档。在页面中创建两个 div 元素并设置data-role=”page” 。 将第一个 div 的 id 保留为HomePage ，将第二个 div 的id保留为AboutUs 。

然后我们将创建两个锚标签，其href属性为href=”#HomePage”和href=”#AboutUs” 分别在两个div中。

Home Page
About Us

然后我们可以根据需要在两个 div 中添加其他内容。

例子：

HTML

  

    
    
    
    
    

  

    a {
        display: inline-block;
    }
  
    a,
    h1 {
        text-align: center;
        margin: 10px;
    }

  

    
        Home Page
        About Us
        Hello geeks this is the home page
    
    
        Home Page
        About Us
        Hello again, this is About Us page
    

  

输出：