jquery mobile主要是应用在移动端网页开发。
站在用户的角度思考问题，与客户深入沟通，找到黄石网站设计与黄石网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：成都网站设计、网站制作、企业官网、英文网站、手机端网站、网站推广、空间域名、网页空间、企业邮箱。业务覆盖黄石地区。
jQuery Mobile是jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。
JQM 的使命是向所有主流移动浏览器提供一种统一体验，使整个 Internet 上的内容更加丰富 — 不管使用哪种查看设备。
JQM 的目标是在一个统一的 UI 中交付超级 JavaScript 功能，跨最流行的智能手机和平板电脑设备工作。与 jQuery 一样，JQM 是一个在 Internet 上直接托管、免费可用的开源代码基础。事实上，当 JQM 致力于统一和优化这个代码基时，jQuery 核心库受到了极大关注。这种关注充分说明，移动浏览器技术在极短的时间内取得了多么大的发展。
以下的默认配置可以通过$.mobile对象重新配置
自定义命名空间s (字符, 默认: ""):
在jQuery Mobile中，甚至可以自定义象HTML5中的data-attribute等系列属性，比如data-role等。这通过自定义命名空间即可实现。比 如可以实现自定义一个名字，变成data-自定义名-role这样的形式。按照“data-属性”格式安排的命名空间，例如：data-role,可以设 置为任何东西，默认为空字符串。如果你包含一个面包屑的话用起来会比较明晰，比如mynamespace-",会映射到 data-mynamespace-foo="...".
这可以通过$.mobile对象中增加ns属性来指定，如下代码：
$(document).bind("mobileinit", function() {
$.mobile.ns = "my-custom-ns";
});
通过上面的代码，建立了一个data-my-customer-ns-role的属性，而不是传统jQuery Mobile中指定的data-role。通过设置自定义的命名空间，可以方便开发者在CSS选择器中进行指定，同时如果要自定义mobile小插件的主 题，则也必须使用自定义命名空间，以示区别。
注意：如果你使用了data-命名空间，你需要在主题的css中手动的更新/覆盖一个选择器。按照以下格式把命名空间并并入到命名空间中。
.ui-mobile [data-mynamespace-role=page], .ui-mobile [data-mynamespace-role=dialog], .ui-page { ...
页面初始化
autoInitializePage(布尔值,默认: true)
当DOM加载完成时，JQM框架会自动调用$.mobile.initializePage方法。如果设为False，页面page则不会自动初始化，在视觉上就会是隐藏的，直到 $.mobile.initializePage 方法被手动调用。
jQuery Mobile提供了一个叫autoInitializePage的属性，这个属性表示页面是否应该初始化，其默认值为true。然而，如果是继承扩展 了$.mobile对象，开发者则可以将该值设置为false,并且在稍晚的时候对页面初始化进行设置。下面的代码中，演示了当其他脚本在运行时，如何暂 时延迟页面的初始化。如果有大量的客户端脚本运行，则一个很好的建议方法是延迟页面的初始化，直到DOM完成加载客户端脚本。
!DOCTYPE HTML
html
head
titleUnderstanding the jQuery Mobile API/title
script type="text/java script" src="jquery.js"/script
script type="text/java script"
$(document).bind("mobileinit", function() {
$.mobile.autoInitializePage = false;
});
/script
script type="text/java script" src="jquery.mobile.js"/script
/head
body
div data-role="page"
div data-role="content"
ul data-role="listview" id="my-list"/ul
/div
/div
script type="text/java script"
$('#my-list').html('lia href="page-2.html"Link to another page/a/li');
$.mobile.autoInitializePage = true;
/script
/body
/html
自定义子页的URL键
subPageUrlKey (字符串，默认: "ui-page")
当在jQuery Mobile中引用子页时，默认使用的是ui-page做为KEY标识。开发者可以通过$.mobile对象的subPageUrlKey去重新设置，比 如如果定义了subPageUrlKey为my-page,则默认的子页引用将从web-page.htmlui-page=value改为 web-page.htmlmy-page=value,这样做的一个好处是开发者可让url更友善更容易维护。
url参数用来指向组件产生的子页面（比如生成的嵌套的列表）。会被转义为example.htmlui-page=subpageIdentifier。Jquery Mobile会把 ui-page=之前的部分用来向子页面的url地址发出ajax请求。
设置历史记录
nonHistorySelectors (字符串, 默认: "dialog")
对于带有 data-rel 属性的a标签链接，或 data-role 属性的页面，如果选择器与之匹配，则他们不会在历史记录中被追踪 (即它们不会在location.hash中被更新也不会被浏览器历史所标记).
设置当前激活页面的样式
activePageClass (字符串, 默认: "ui-page-active")：给当前页面(包括转场中的) 分配class。
当使用了jQuery Mobile后，默认当前激活页面中的ui-page元素都会使用框架默认的样式中定义的ui-page-active，如果要对其进行修改，可以设置$.mobile对象中的activePageClass属性，比如：
$(document).bind("mobileinit", function(){
$.mobile.activePageClass="ui-page-custom";
});
其中ui-page-custome则为用户自定义的样式。
设置当前激活页面的按钮
activeBtnClass (字符串, 默认: "ui-page-active")：给活动状态的按钮分配class值，该class值必须在css框架中存。
设置ajax
ajaxEnabled (布尔值, 默认: true)：Jquery Mobile 会自动通过ajax处理链接点击以及表单提交。如果无法处理，url hash 监听将会被禁用，url也会像常规那样发出HTTP 请求.
ajaxLinksEnabled (布尔值, 默认: true)：可行时，Jquery Mobile 就会自动通过ajax处理链接的点击。
ajaxFormsEnabled (布尔值, 默认: true)：可行时，Jquery Mobile 就会自动通过ajax处理表单的提交。
设置哈希值
hashListeningEnabled (布尔值, 默认: true)
Jquery Mobile 会自动监听与处理 location.hash的改变。禁用它会防止Jquery Mobile处理 location.hash的改变。使你可以自己处理他们，或者在文档中用完整的链接地址指到一个特定的id值上。
设置默认的转场效果
defaultTransition (字符串, 默认: 'slide')：设定使用AJAX进行页面转场的默认的转场效果。设为"none"的话则默认没有转场的动画。
默认的jQuery Mobile的页面和对话框的效果都是通过ajax实现的。默认的页面切换效果是幻灯片切换，默认的对话框出现的效果是弹出。如果需要改变这些效果的话 ，同样是如下代码所示，设置$.mobile对象的defaultPageTransition和defaultDialogTransition属性就 可以了。
$(document).bind("mobileinit", function() {
$.mobile.defaultPageTransition = "fade";
$.mobile.defaultDialogTransition = "fade";
});
jQuery Mobile提供了6种效果供用户选择，分别是：slide, slideup, slidedown, pop, fade, 和flip，用户可以按照上面的方法进行设置。
设置加载时默认信息
loadingMessage (字符串, 默认: "loading")：设置页面加载时显示的文本. 如果设置为false，将不会显示任何文字。
加载信息会在加载页面时显示给用户看，要更改这个设置，只需要修改$.mobile对象的loadingMessage属性即可，如下：
$(document).bind("mobileinit", function() {
$.mobile.loadingMessage = "Please wait";
});
设置加载时错误信息
pageLoadErrorMessage (字符串, 默认: "Error Loading Page")：通过ajax加载页面失败时出现的文本信息。
$(document).bind("mobileinit", function() {
$.mobile.pageLoadErrorMessage = 'Sorry, something went wrong. Please try again.';
});
设置页面的最小的卷动距离
minScrollBack (字符串,默认:'150')：返回一个页面的最小的卷动距离。
gradeA (返回一个布尔值, 默认: 返回$.support.mediaquery的值)：浏览器必须符合所有支持的条件才会返回 true.
jquerymobile是以jquery为基础的.
其相关的接口和使用的页面样式都是为了达到让web app更趋向于native app的目的.
可以理解为jquery是为了传统web而生,而jquerymobile相当于jquery的扩展,是为了让传统的web更像现在的手机应用.
jquery mobile不需要安装，这就是一个jq框架，是创建移动 web 应用程序的框架。你只需要找到下载了jquery mobile.js和jquery mobile.css然后跟引入js和css文件那样引入就可以了
!DOCTYPE html
html
head
link rel="stylesheet" href=""//这是引入的css文件
script src=""/script//这是引入的jq库
script src=""/script//这是引入的js文件
/head
body
div data-role="page" id="pageone"
div data-role="header"
h1在此处插入标题/h1
/div
div data-role="content"
p在此处插入正文/p
/div
div data-role="footer"
h1在此处插入页脚文本/h1
/div
/div
/body
/html
上面的那三个缺一不可。
如何使用默认调板
jQueryMobile内建了主题控制相关模块。调板可以使用data-theme属性来控制。如果你不指定data-theme属性，将默认采用a调板。以下代码定义了一个采用默认调板的页面：
div data-role="page" id="page"
div data-role="header"
h1Sample Page/h1
/div
div data-role="content"
pI'm a sample page!/p
/div
/div
使用不同的调板：
div data-role="page" id="page" data-theme="e"
div data-role="header"
h1Sample Page/h1
/div
div data-role="content"
pI'm a sample page!/p
/div
/div
从代码结构上看是一样的，仅仅使用一个data-theme="e"便可以将整个页面切换为黄色色调：
默认情况下页面上所有的控件都会继承page上设置的调板，这意味着你只需设置一次便可以更改整个page：
div data-role="page" id="page" data-theme="e"
当然你也可以独立设置不同元素的调板，同样设置元素的data-theme属性来实现：
div data-role="page" id="page"
div data-role="header" data-theme="c"
h1Header/h1
/div
div data-role="content" data-theme="d"
pContent/p
pnbsp; /p
ul data-role="listview" data-theme="b"
lia href="#page1"Page 1/a/li
/ul
div data-role="collapsible-set"
div data-role="collapsible" data-theme="b"
h3Header/h3
pContent/p
/div
div data-role="collapsible" data-collapsed="true" data-theme="a"
h3Header/h3
pContent/p
/div
div data-role="collapsible" data-collapsed="true" data-theme="e"
h3Header/h3
pContent/p
/div
/div
/p
pnbsp;a href="#page4" data-role="button" data-icon="arrow-d" data-iconpos="left" data-theme="e"Go To Page 4/a/p
/div
div data-role="footer"
h4Footer/h4
/div
/div
jQuery Mobile是jQuery 框架的一个组件（而非jquery的移动版本）。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说：能开发这个项目，我们非常兴奋。移动Web太需要一个跨浏览器的框架，让开发人员开发出真正的移动Web网站。
