`
lifaming15
  • 浏览: 64769 次
  • 来自: ...
文章分类
社区版块
存档分类

jQuery Mobile简单使用说明

 
阅读更多

简介：jQuery Mobile框架可以轻松的帮助我们实现非常好看的、可跨设备的Web应用程序。我们将后续的介绍中向大家介绍大量的代码及实例。

jQuery一直以来都是非常流行的富客户端及Web应用程序开发中使用的JavaScript类库,然而一直以来它都是为桌面浏览器设计的，没有特别为移动应用程序设计。

jQuery Mobile是一个新的项目用来添补在移动设备应用上的缺憾。它是基本jQuery框架并提供了一定范围的用户接口和特性，以便于开发人员在移动应用上使用。使用该框架可以节省大量的js代码开发时间，尽管目前的版本还是不是一个稳定的版本。但它的应用效果已经备受瞩目。

接下来我们将通过实例向大家展示jQuery Mobile的特性及好处，让我们看一下这个新框架是怎么帮助你在短时间内建立起一个高质量的移动应用程序,接下来的代码讲解中的代码最好使用的移动设备平台是IPhone或Android。或者是PC电脑上使用Safari浏览器调试。

Goon!

jQuery Msobile都能做什么?

ØjQuery Mobile为开发移动应用程序提代了非常简单的用户接口

Ø这种接口的配置是标签驱动的，这意味着我们可以在HTML中建立大量的程序接口而不不需要写一行js代码

Ø提供了一些自定义的事件用来探测移动和触摸动作。例如tap(敲击)、tap-and-hold（点击并按住）、swipe、orientation change

Ø使用一些加强的功能时需要参照一下设备浏览器支持列表

Ø使用预设主题可以轻松定制应用程序外观

jQuery Mobile基本页面结构

大部分jQuery Mobile Web应用程序都要遵循下面的基本模板

<!DOCTYPE html>

<html>

<head>

<title>Page Title</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>

<body>

<div data-role="page">

<div data-role="header">

<h1>Page Title</h1>

</div>

<div data-role="content">

<p>Page content goes here.</p>

</div>

<div data-role="footer">

<h4>Page Footer</h4>

</div>

</div>

</body>

</html>

要使用jQuery Mobile，首先需要在开发的界面中包含如下3个内容

ØCSS文件jquery.mobile-1.0a1.min.css

ØjQuery library jquery-1.4.3.min.js

ØjQuery Mobile library jquery.mobile-1.0a1.min.js

在上面的页面基本模板中，引入这三个元素采用的是jQuery CDN方式，开发人员也可以下载这些文件及主题到你的服务器上。

我们可以看到页面中的内容都是包装在div标签中并在标签中加入data-role=”page”属性。这样jQuery Mobile就会知道哪些内容需要处理。

说明：data-属性是HTML5新推出的很有趣的一个特性，它可以让开发人员添加任意属性到html标签中,只要添加的属性名有“data-”前缀。

在”page”div中，还可以包含”header”，”content”，”footer”的div元素,这些元素都是可选的，但至少要包含一个“content”div。

<div dat-role=”header”></div>

在页面的顶部建立导航工具栏，用于放置标题和按钮（典型的至少要放一个“返回”按钮，用于返回前一页）。通过添加额外的属性

data-position=”fixed”，可以保证头部始终保持屏幕的顶部

<div dat-role=”content”></div>

包含一些主要内容，例如文本内容，图像，按钮，列表，表单等等

<div dat-role=”footer”></div>

在页面的底建立工具栏，添加一些功能按钮

为了确保它始终保持在页面的底部，可以给其加上data-position=”fixed”属性

多个页面在同一个页面中

有一种建立在一个HTML页面基础之上的页面结构，即在一个页面中添加多个data-role=”page”。这意味着浏览器仅仅得到一个页面，就可以实现页面平滑切换的客户体验。参看下面实例：(目前有bug)

<!DOCTYPE html>

<html>

<head>

<title>jQuery Mobile: Pages within Pages</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>

<body>

<div data-role="page" id="home">

<div data-role="header">

<h1>Home</h1>

</div>

<div data-role="content">

<p><a href="#about">About this app</a></p>

</div>

</div>

<div data-role="page" id="about">

<div data-role="header">

<h1>About This App</h1>

</div>

<div data-role="content">

<p>This app rocks! <a href="#home">Go home</a></p>

</div>

</div>

</body>

</html>

正如所见，上面的代码中包含了两个”page”:主页（id为home）和”about”(id为about)。从Home链接到About页面采用的是连接地址为#about，about页面返回到首页的链接地址为#home。jQuery Mobile会自动切换链接的目的div显示到移动浏览器中。该框架会隐藏除第一个包含data-role=”page”div以外的其它”page”

AJAX导航

为了实现在移动设备上的无缝客户体验，jQuery Mobile默认采用AJAX的方式载入一个目的链接页面。因此，当在浏览器中点击一个链接打一个新的页面时，jQuery Mobile接收这个链接，通过AJAX的方式请求链接页面，并把请求得到的内容注入到当前页面的DOM里。另外还需要确保请求的页面url唯一标识的。

这样的结果就是用户交互始终保存在同一个页面中。新页面中的内容也会轻松的显示到这个页面里。这种平滑的客户体验相比于传统打开一个新的页面并等待数秒的方式要好很多。当一个新的页面做为新的data-role=”page” div插入到主页面时，主页面会有效的缓存取到的内容。使得当要访问一个页面时能够尽快的显示出来。这个工作过程听起来难以置信的复杂，但是做为开发人员的我们大部份不需要了解其中工作的具体细节。只要能看到效果就OK。

注意:如果你不想采用AJAX的方式加载页面，而想以原生的页面加载方式打开一个链接页面，只需要在打开的链接上添加属性rel=”external”属性

页面切换效果

你可以使用多种不同的切换效果来显示新页面内容，只需要在链接里添加data-transition属性即可。可能的值如下

slide

从右到左切换（默认）

slideup

从下到上切换

slidedown

从上到下切换

pop

以弹出的形式打开一个页面

fade

渐变退色的方式切换

flip

旧页面翻转飞出，新页面飞入

例如

<p><a href=”#about” data-transition=”flip”>关于页面</a></p>

在浏览器中查看效果

注意：查看以上的效果需要您的浏览器支持jQuery Mobile。例如：Mobile Safari, DeskTop Safari,或Chrome。

对话框

通过在链接中添加data-rel=”dialog”的属性，可以使链接页面的显示方式变为对话框。给显示的对话框加入切换的效果也是一个不错的选择

例如我们将about的链接变成一个对话框并加入相应的切换效果。代码如下

<p><a href="#about" data-rel="dialog" data-transition="slideup">About this app</a></p>

注意：目前的测试版本存在问题，当在一个页面中写多个”page”时在以dialog的方式打开一个页面时，不会出现对话框效果

按钮

按钮是触摸式应用程序的一部分，它们扮演链接的功能，因为它们提供了更大的目标，当你点击链接的时候（比较适合，手指比较胖的人群）

在jQuery Mobile中把一个链接变成button的效果，只需要在标签中添加data-role=”button属性即可”。例如：

<div data-role="content">

<p><a href="#about" data-role="button">About this app</a></p>

</div>

...

<div data-role="content">

<p>This app rocks!</p>

<a href="#home" data-role="button">Go home</a>

</div>

另外jQuery Mobile也会自动的转换像表单元素中的submit，reset，button，或image为按钮样式。

还可以利用data-icon属性建立各式各样的按钮，建立行内按钮和按钮组（水平或垂直的）

格式化文本

为了使其尽可能的灵活，jQuery Mobile使更多的普通HTML内容更加独立。加入适当的缩进使内容的可读性更强。

有两种布局方法使其格式化变得更简单：布局表格和可折叠的内容块

Ø布局表格：组织内容以列的形式显示，有两列表格，和三列表格

Ø可折叠的内容：当点击内容块的标题，则会将其隐藏的详细内容展现出来

下面是一个可折叠内容的实例，单击标题将看到具体的内容，再点击标题则会将展现的内容隐藏。

<!DOCTYPE html>

<html>

<head>

<title>Collapsible Content Demo</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>

<body>

<div data-role="page" id="home">

<div data-role="header">

<h1>Home</h1>

</div>

<div data-role="content">

<div data-role="collapsible" data-state="collapsed">

<h3>About this app</h3>

<p>This app rocks!</p>

</div>

</div>

</div>

</body>

</html>

触摸选择的表单元素

jQuery Mobile会自动替换标准的HTML表单元素，例如文本框，复选框，列表框。以这种自定义的样式工作在触摸设备上的表单元素，易用性更强。

例如，复选框将会变得很大，易于点选。点击下拉列表时，将会弹出一组大按钮列表选项，提供给用户选择。

该框架支持新的HTML5元素，例如search和range。另外你可以利用列表框并添加data-role=”slider”并添加两个option选项，创建不错的”打开/关闭”开关，

另外一个不错的特点是组合单选框和组合复选框，可以利用fieldset元素添加属性data-role=”controlgroup”来创建一组单选按钮或复选框，jQuery Mobile自动格式化他们的格式。使它们看上去更fashion!

一般来说，开发者不需要关心表单的那些高级特性，开发者仅需要以正常的方式创建你的表单，jQuery Mobile框架会帮你完成剩余的工作。另外有一件事情需要开发人员来完成，即使用div或fieldset属性data-role=”fieldcontain”包装每一个label/field。这样jQuery Mobile会在label/field对之间添加一个水平分割条。这样的对齐方式可以使其更容易查找。

下面是一个jQuery Mobile版的表单元素

<!DOCTYPE html>

<html>

<head>

<title>jQuery Mobile Form Demo</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>

<body>

<div data-role="page" id="home">

<div data-role="header">

<h1>Ice Cream Order Form</h1>

</div>

<div data-role="content">

<form action="#" method="get">

<div data-role="fieldcontain">

<label for="name">Your Name:</label>

<input type="text" name="name" id="name" value=""/>

</div>

<div data-role="controlgroup">

<legend>Which flavour(s) would you like?</legend>

<input type="checkbox" name="vanilla" id="vanilla" class="custom" />

<label for="vanilla">Vanilla</label>

<input type="checkbox" name="chocolate" id="chocolate" class="custom" />

<label for="chocolate">Chocolate</label>

<input type="checkbox" name="strawberry" id="strawberry" class="custom" />

<label for="strawberry">Strawberry</label>

</div>

<div data-role="fieldcontain">

<label for="quantity">Number of Cones:</label>

<input type="range" name="quantity" id="quantity" value="1" min="1" max="10"/>

</div>

<div data-role="fieldcontain">

<label for="sprinkles">Sprinkles:</label>

<select name="sprinkles" id="sprinkles" data-role="slider">

<option value="off">No</option>

<option value="on">Yes</option>

</select>

</div>

<div data-role="fieldcontain">

<label for="store">Collect from Store:</label>

<select name="store" id="store">

<option value="mainStreet">Main Street</option>

<option value="libertyAvenue">Liberty Avenue</option>

<option value="circleSquare">Circle Square</option>

<option value="angelRoad">Angel Road</option>

</select>

</div>

<div class="ui-body ui-body-b">

<fieldset class="ui-grid-a">

<div class="ui-block-a"><button type="submit" data-theme="d">Cancel</button></div>

<div class="ui-block-b"><button type="submit" data-theme="a">Order Ice Cream</button></div>

</fieldset>

</div>

</div>

</div>

</body>

</html>

列表视图

列表视图是jQuery Mobile中功能强大的一个特性。它会使标准的无序或有序列表应用更广泛。应用方法就是在ul或ol标签中添加data-role=”listview”属性。

下面的一些情景将会用到创建列表视图

简单的文件列表项

Ø简单的文件列表，会有一个好看的盒环绕着每一个列表项

Ø链接列表，框架会自动为每一个链接加一个箭头”>”，显示在链接按钮的右侧

Ø嵌套列表，如果你在一个li中嵌套另一个ul，jQuery Mobile会为这个嵌套列表自动建立一个”page”，并为它的父li自动加一个链接，这样很容易实现树状菜单选项，设置功能等等。

Ø分隔线的按钮列表，在一个li中存放2个链接，你可以建立一个还垂直分隔条，用户可点击左侧或右侧的列表选项，展现不同的内容

Ø记数气泡如果你在列表选项中添加class=”ui-li-count”，框架会在其中生成一个”小泡泡”图标显现于列表选项的右侧，并在”小泡泡”中显示一些内容。类似在收信箱中看到已经收到的信息条数

Ø查找过滤在ul或ol中添加data-filter=”true”属性。则这个列表项就具备的查询的功能。”Filter result…”文本框将会显示在列表项的上面，允许用户根据条件来将一个大的列表项变小（过滤显示）

Ø列表分隔将列表项分割，可以在任意列表项上添加属性data-role=”list-divider

Ø列表缩略图和图标。将img元素放在在列表项的开始，jQuery Mobile将会以缩略图的形式来展现，图片的大小为80 X 80像素。如果添加class=”ui-li-icon”类样式img元素的大小将会以16 X 16像素的图标

以下是一个列表项的实例

<!DOCTYPE html>

<html>

<head>

<title>jQuery Mobile Lists Demo</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>

<body>

<div data-role="page" id="home">

<div data-role="header">

<h1>Lists Demo</h1>

</div>

<div data-role="content">

<h2 style="padding: 1em 0;">A list view</h2>

<ul data-role="listview" data-inset="true">

<li>Cat</li>

<li>Dog</li>

<li>Mouse</li>

<li>Squirrel</li>

</ul>

<h2 style="padding: 1em 0;">A list of links</h2>

<ul data-role="listview" data-inset="true">

<li><a href="#">About this app</a></li>

<li><a href="#">Buy ice cream</a></li>

<li><a href="#">Find a store</a></li>

</ul>

<h2 style="padding: 1em 0;">Nested lists</h2>

<ul data-role="listview" data-inset="true">

<li>Play

<ul>

<li><a href="#">Easy</a></li>

<li><a href="#">Medium</a></li>

<li><a href="#">Hard</a></li>

</ul>

</li>

<li>Settings

<ul>

<li><a href="#">Graphics</a></li>

<li><a href="#">Sound</a></li>

<li><a href="#">Device</a></li>

</ul>

</li>

<li>Highscores

<ul>

<li><a href="#">View</a></li>

<li><a href="#">Submit</a></li>

<li><a href="#">Reset</a></li>

</ul>

</li>

</ul>

<h2 style="padding: 1em 0;">A split button list with filter</h2>

<ul data-role="listview" data-inset="true" data-filter="true">

<li>

<a href="#">The Grapes of Wrath</a>

<a href="#">Buy This Book</a>

</li>

<li>

<a href="#">The Trial</a>

<a href="#">Buy This Book</a>

</li>

<li>

<a href="#">A Tale of Two Cities</a>

<a href="#">Buy This Book</a>

</li>

</ul>

<h2 style="padding: 1em 0;">A list with count bubbles</h2>

<ul data-role="listview" data-inset="true">

<li><a href="#">SuperWidgets</a> <span class="ui-li-count">14</span></li>

<li><a href="#">MegaWidgets</a> <span class="ui-li-count">0</span></li>

<li><a href="#">WonderWidgets</a> <span class="ui-li-count">327</span></li>

</ul>

</div>

</div>

</body>

</html>

data-inset=”true”将格式化列表块为圆角化，如果你使用这种样式的话，列表条目的宽度拉伸成与浏览器窗口的宽度一致

还有好多有趣的列表视图可以参见jQuery Mobile档。链接如下

http://jquerymobile.com/demos/1.0a1/#docs/lists/index.html

主题

jQuery Mobile渲染的灰色、黑色和蓝色及圆形的组件使其看起来很漂亮，但是如果你的整个应用都使用这样的样式，将会使其变得很乏味。jQuery Mobile允许你自定义官方一些组件的主题。例如：

ØFont family

ØDrop shadows

Ø按钮和盒状元素的边框圆角半径

Ø图标组件

另外，每一个主题包含26种不同颜色的切换（标记从a到z），可以控制前景颜色，背景色和渐变色，典型用法是使页面元素部分替换，你可以使用data-theme属性。例如：

<!DOCTYPE html>

<html>

<head>

<title>Page Title</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>

<body>

<div data-role="page" id="home">

<div data-role="header">

<h1>Home</h1>

</div>

<div data-role="content">

<a href="#" data-role="button" data-theme="a">About this app</a>

<a href="#" data-role="button" data-theme="b">About this app</a>

<a href="#" data-role="button" data-theme="c">About this app</a>

<a href="#" data-role="button" data-theme="d">About this app</a>

<a href="#" data-role="button" data-theme="e">About this app</a>

</div>

</div>

</body>

</html>

事件

框架还提供了简单的用户接口，并添加了移动设备支持的特殊事件。

<!DOCTYPE html>

<html>

<head>

<title>jQuery Mobile Events</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />

<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

<script type="text/javascript">

$( function() {

$('body').bind( 'taphold', function( e ) {

alert( 'You tapped and held!' );

e.stopImmediatePropagation();

return false;

} );

$('body').bind( 'swipe', function( e ) {

alert( 'You swiped!' );

e.stopImmediatePropagation();

return false;

} );

} );

</script>

</head>

<body>

<div data-role="page" id="home">

<div data-role="header">

<h1>jQuery Mobile Events</h1>

</div>

<div data-role="content">

<p>Try:</p>

<ul>

<li>Tapping and holding</li>

<li>Swiping</li>

</ul>

</div>

</div>

</body>

</html>

附录

分享到：
| Objective-C语法快速参考
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jqmDemo，jQuery Mobile

    jQuery Mobile的主要优点包括跨平台兼容性、一致的用户界面和简单的API，使得开发者可以快速构建功能丰富的移动应用。 在jqmDemo中，我们可以看到多个HTML文件，如iOS-Inspired.html、index.html、content.html、...

    jQuery mobile开关式按键

    在IT领域，jQuery Mobile是一个广泛使用的前端框架，用于构建响应式和触摸友好的移动Web应用程序。这个框架提供了许多UI组件，使得开发者可以轻松地创建出与原生应用体验相媲美的网页应用。其中，“开关式按键”...

    jquery mobile的所有版本库api文档简单示例demo下载jqm学习大全

    jquery mobile的所有版本库api文档简单示例demo下载jqm学习大全下载后评论反积分！ jQuery Mobile是jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整...

    jquery mobile分页显示插件

    jQuery Mobile 的分页插件使得这一过程更加简单。 2. **jQuery Mobile 框架**：jQuery Mobile 提供一套完整的 UI 组件，包括按钮、表单、工具栏、面板等，用于构建美观的移动界面。其响应式设计适应各种屏幕尺寸。 ...

    Master Mobile Web Apps with jQuery Mobile

    - **标签：“jQueryMobile”** - **关键词提取**：jQuery Mobile作为标签，明确了本书的重点技术领域和工具选择。 - **关联性**：jQuery Mobile是构建响应式移动Web应用的强大框架，这直接关联到书籍的主题。 ###...

    JqueryMobile页面间跳转时的参数传递

    ### JqueryMobile页面间跳转时的参数传递 在使用jQuery Mobile进行移动Web应用开发时，经常需要在不同页面之间传递参数。这种功能对于实现页面之间的数据交互至关重要。本文档将通过一个具体的代码示例来详细说明...

    Pro jQuery Mobile

    《Pro jQuery Mobile》是一本针对初学者的快速入门书籍，它全面地介绍了如何使用jQuery Mobile框架开发跨平台的移动Web应用。本书由Brad Broulik撰写，适合具有中级到高级水平的专业人士阅读。jQuery Mobile是一个...

    jquery mobile RSS阅读器demo

    在Web开发领域，jQuery Mobile是一个强大的框架，它专为移动设备设计，提供了丰富的交互式UI组件，使得构建触屏友好的网页应用变得简单。结合RSS（Really Simple Syndication）技术，我们可以创建一个功能完善的RSS...

    jQuery Mobile中文手册

    jQuery Mobile是一个基于jQuery的用户界面系统，它为开发跨平台的移动Web应用程序提供了一种统一的解决方案。...这些知识点对于希望学习或已经使用jQuery Mobile的开发人员来说，是非常重要的参考资料。

    推荐jQueryMobile插件和教程.docx

    另外，jQueryMobile Toolsbars & Navigation Menu’s则关注于构建头部和底部的导航菜单，提供可定制的触控菜单。 4. **jQuery Mobile Datepickers** 在移动应用中，日期选择器是必不可少的。jQuery Mobile 提供了...

    jquery移动开发组件包

    `jquery.mobile-1.2.0` 文件夹内还可能包含官方文档，例如 HTML 版本的 API 文档或 PDF 手册，提供详细的组件使用说明、API 参考以及最佳实践。这些文档是学习和解决开发中遇到问题的重要资源。 ### 6. 自定义主题...

    jQuery Mobile v1.4.5.zip

    在这个压缩包中，"说明.htm"文件很可能是对jQuery Mobile v1.4.5的使用指南或快速入门教程，帮助开发者了解如何部署和使用这个框架。而"jquery-mobile-1.4.5"文件夹则包含了整个框架的源代码，包括CSS、JavaScript...

    适合移动手机的jQuery多级侧边栏菜单插件

    在实际使用hc-mobile-nav插件时，你需要将jQuery库和插件的JavaScript及CSS文件引入到你的HTML文件中，并按照readme.html中的指示进行配置，然后在HTML结构中定义侧边栏菜单的元素，插件会自动处理这些元素并创建...

    jquery-1.7.1 及 jquery1.4.1中文手册（最新）

    **jQuery 1.4.1中文手册** `jQueryAPI-100214.chm`是开发者的重要参考资料，它详细介绍了jQuery的各个API，包括函数用法、参数说明和示例，帮助开发者深入理解和使用jQuery。 总之，这个压缩包提供了jQuery的基础和...

    使用jQuery mobile NuGet让你的网站在移动设备上同样精彩

    在 Visual Studio 中，选择 "Tools" -&gt; "Library Package Manager" -&gt; "Manage NuGet Packages for Solution"，然后在线搜索 "jQueryMobile" 进行安装。安装过程中，记得先更新 jQuery 的版本，因为某些旧版本的 MVC...

    jquery 中文说明文档

    jQuery的生态系统庞大，拥有无数插件和库，如jQuery UI用于创建用户界面，jQuery Mobile针对移动设备优化，以及众多第三方插件用于表单验证、轮播图、日期选择等。通过使用插件，可以极大地扩展jQuery的功能。 总的...

    jqm-transitions:jquery-mobile 使用速度和 jquery-ui 进行转换

    在移动应用开发中，jQuery Mobile 是一个非常流行的框架，它为构建触摸友好的用户界面提供了丰富的组件和交互效果。这个项目“jqm-transitions”似乎专注于利用 jQuery Mobile 的过渡效果，并结合 jQuery UI 的功能...

    jquery基础教程（第四版）

    - **DOM操作**：详细说明jQuery如何帮助开发者简单地添加、删除或修改页面上的元素。 - **Ajax支持**：介绍jQuery内置的Ajax功能，简化异步请求的编写过程。 #### 五、jQuery UI与Mobile - **jQuery UI**：一个...

    jQuery Mobile 实例

    在实际开发中，开发者可以通过查看jQuery Mobile的官方文档，参考大量的教程和博客文章，来获得关于实例的详细说明和具体的代码实现。同时，也可以通过项目实践来加深对jQuery Mobile框架的理解和应用。

Magicbox
Global site tag (gtag.js) - Google Analytics