JQuery Mobile是一个基于jquery的移动端Web开发框架，它可以快速的构建出适用于移动设备的Web应用。其中多级导航是一个非常重要的特性，它能够让用户方便快捷地定位到自己需要的页面。

在JQuery Mobile中，多级导航需要使用到页面容器（page container）和导航栏（navbar），其中页面容器用来存放页面内容，导航栏则用来实现页面之间的切换。

以下是一个简单的多级导航示例：

<!-- 定义页面容器 -->
<div data-role="page" id="page1">
<div data-role="header">
<h1>页面1</h1>
</div>
<div data-role="content">
<p>这是页面1的内容</p>
<a href="#page2" data-role="button">前往页面2</a>
</div>
</div>
<!-- 定义导航栏 -->
<div data-role="navbar">
<ul>
<li><a href="#page1" class="ui-btn-active">页面1</a></li>
<li><a href="#page2">页面2</a></li>
</ul>
</div>
<!-- 定义页面容器 -->
<div data-role="page" id="page2">
<div data-role="header">
<h1>页面2</h1>
</div>
<div data-role="content">
<p>这是页面2的内容</p>
<a href="#page1" data-role="button">返回页面1</a>
</div>
</div>

在上面的示例中，我们定义了两个页面容器（page container）和一个导航栏（navbar），通过对页面容器和导航栏的定义，我们就实现了一个基本的多级导航效果。当用户点击导航栏中的某个链接时，页面容器就会自动地切换到相应的页面，从而实现了快速跳转的效果。