经典收藏 50个jQuery Mobile开发技巧集萃（2）

http://hi.baidu.com/bujichong/item/f0ef58e1e6ee57266dabb836

14、jQuery Mobile简介

可以学习如何使用jQuery Mobile框架。这个基本简介主要介绍了如何建立页面、链接、导航和按钮。

相关链接：http://www.youtube.com/watch?v=VY20Q6ON4QA

 

15、设定页面的背景颜色

通常你会给主体元素设定背景颜色，但如果你在使用jQuery Mobile框架，就需要把它设成ui-page类。

相关链接：http://eisabainyo.net/weblog/2011/01/31/top-10-jquery-mobile-code-snippets-that-you-need-to-know/

 

 

16、jQuery Mobile：我能为你做些什么?

可以弄清楚新的jQuery Mobile框架如何帮你轻松构建外观出色、跨设备运行的web应用程序。包括许多代码示例和演示。可以学习创建一个简单的jQuery Mobile应用程序。

相关链接：http://www.elated.com/articles/jquery-mobile-what-can-it-do-for-you/

17、禁止装入弹出式消息

我觉得装入弹出式消息有点烦人，因为每当你装入不同的页面，该操作就会被触发。想禁止这个操作，只要往你的JS文件中添加下面这行代码。

相关链接：http://eisabainyo.net/weblog/2011/01/31/top-10-jquery-mobile-code-snippets-that-you-need-to-know/

18、如何使用jQuery Mobile来创建RSS阅读程序

如今，我们会深入介绍使用PHP 和jQuery Mobile，创建一个简单的Tuts+ RSS阅读程序。创建完毕后，你只要点击一下按钮，并且运用构建web应用程序的技能，就可以把这个简单项目添加到你的iPhone或Android手机上。

相关链接：http://net.tutsplus.com/tutorials/javascript-ajax/how-to-build-an-rss-reader-with-jquery-mobile-2/

19、“Cancel”和“Save”按钮组合

这 段代码满足了两个基本要求。第一个要求是，让两个按钮彼此相邻。幸好，jQuery Mobile库有一种内置的列结构，只要使用fieldset标签和合适的类，很容易利用这种结构，如下所示。第二个要求是，让两个按钮有不同的主题。这 段代码直接来自说明文档，我把它留在手边，以便经常使用。

相关链接：http://www.webdesignerdepot.com/2011/05/10-handy-jquery-mobile-tips-and-snippets-to-get-you-started/

20、使用jQuery锁定平台

尽管我们很想为某些设备执行某些CSS语句，但我们也想只在特定的设备上运行jQuery。下面对来自Snipplr的一些代码作了改动，那样我很容易把jQuery的一部分隔离开来，以便根据用户的设备来运行。

相关链接：http://snipplr.com/view/31607/iphone-ipad-ipod-detect/

 

 

21、创建自定义主题

jQuery Mobile框架随带五个主题：主题A、主题B、主题C、主题D和主题E。但是你很容易为自己的web应用程序创建一个新主题。

相关链接：http://eisabainyo.net/weblog/2011/01/31/top-10-jquery-mobile-code-snippets-that-you-need-to-know/

22、阻止一些关键项目被截断

库的一项特性(或者是缺点，就看你的需要了)在于，它能够智能化地截断很长的项目，以适应用户界面元素。

在两种情况下这可能很烦人。首先在列表项目中，我更喜欢看到全部文本。其次是在脚注文本中。

相关链接：http://www.webdesignerdepot.com/2011/05/10-handy-jquery-mobile-tips-and-snippets-to-get-you-started/

23、两个iPhone开发技巧，jQuery出手相助

第一个也是最简单的技巧是，使用视口。(你可能需要向苹果公司注册，才能查看该链接。需要登录才能访问简单的文档，对苹果扣两分!)视口是一个简单的元标签。这是个例子：

相关链接：http://www.coldfusionjedi.com/index.cfm/2008/10/9/Two-iPhone-development-tips-and-jQuery-to-the-rescue

24、从列表项移除箭头

默认情况下，jQuery Mobile框架在每个列表项旁边添加一个箭头。想禁用这项功能，只要针对你想移除箭头的那个列表项，将data-icon属性设成“false”。

相关链接：http://eisabainyo.net/weblog/2011/01/31/top-10-jquery-mobile-code-snippets-that-you-need-to-know/

25、jQuery Mobile表单验证

可以通过这个教程学习jQuery Mobile表单验证。

相关链接：http://www.elijahmanor.com/2011/02/jquery-mobile-form-validation.html

26、使用JQuery Mobile的HTML5画布元素，侦听iPad和Android浏览器上的触摸事件

JQuery Mobile支持众多的触摸事件，大大简化了开发人员的工作。实际上，JQuery Mobile确保你的web应用程序在移动浏览器和台式机/笔记本电脑浏览器上都可以运行。 遗憾的是，你根本无法预料JavaScript点击事件在移动设备上会如同在台式机/笔记本电脑浏览器上那样运行。

相关链接：http://www.giantflyingsaucer.com/blog/?p=2658

27、jQuery Mobile触摸事件：快速按下

可以学习如何检测智能手机设备上的“快速按下”触摸事件。

相关链接：http://www.youtube.com/watch?v=-ywcCfbnQhM&feature=related

28、使用带appMobi的JQuery Mobile

这个教学视频向你表明了如何使用带appMobi的流行JQuery JavaScript库的新移动版本。JQuery Mobile让你可以很容易创建具有原生应用程序所有外观感觉的应用程序，拥有内置的按钮、转换效果和表单等。

相关链接：http://www.youtube.com/watch?v=otBNufYLXNc&feature=related

29、同时禁用所有链接的AJAX导航功能

尽管AJAX导航功能很出色，但有时候你完全想要禁用这项功能。使用这段jQuery代码，告诉移动库不要使用AJAX导航功能。

相关链接：http://www.webdesignerdepot.com/2011/05/10-handy-jquery-mobile-tips-and-snippets-to-get-you-started/