开始学习 jQuery Mobile

实例

	

  

    
欢迎来到我的主页
  
  
  

    
我现在是一个移动端开发者!!
  
  
  

    
底部文本
  

实例解析：

• data-role="page" 是在浏览器中显示的页面。
• data-role="header" 是在页面顶部创建的工具条 (通常用于标题或者搜索按钮)
• data-role="main" 定义了页面的内容，比如文本， 图片，表单，按钮等。
• "ui-content" 类用于在页面添加内边距和外边距。
• data-role="footer" 用于创建页面底部工具条。
• 在这些容器中你可以添加任何 HTML 元素 - 段落, 图片, 标题, 列表等。

在页面中添加 jQuery Mobile

借助 jQuery Mobile，一个 HTML 文件里就能同时组织出多个彼此独立的页面，开发起来会灵活很多。

你可以使用不同的href属性来区分使用同一个唯一id的页面：

实例

	

  

    跳转到第二个页面
  


  

    跳转到第一个页面
  

注意： 一旦 Web 应用里塞进了大量内容，比如文本、图片、脚本等，加载时间往往会被明显拖慢。要是不打算使用内页链接，也可以直接改用外部文件：

访问外部文件

页面作为对话框使用

对话框是用于显示页面信息显示或者表单信息的输入。

在链接中添加data-rel="dialog"让用户点击链接时弹出对话框:

实例

	

  

    跳转到第二个页面
  
  


  

    
  跳转到第一个页面