第十三篇、jQuery Mobile

1.创建Button

  <button>按钮</button>

  <input type="button" value="按钮"/ >

  <a href="#" class="ui-btn ui-shadow(阴影)">按钮</a> // 一排可以放多个按钮ui-btn-inline(横向排列)

  <div class="controlgroup" data-type="horizontal(方向,指定后没有间距)">

    <a href="#" class="ui-btn ui-shadow">按钮</a>

    <a href="#" class="ui-btn ui-shadow">按钮</a>

    <a href="#" class="ui-btn ui-shadow">按钮</a>

  </div>

  

2.checkboxradio(单选和复选框)

  <label><input type="checkbox"/>苹果</label>

  fieldset(创建一组排序)

  单选框只能选择一个(例如性别的选择)

3.collapsible(可展开项)可以展开文字,列表

  data-collapsed="false"

  data-collapsed-theme="false"

4.Grid Layout 删格系统a-d(2~5列)

  <div class="ui-grid-solo(只有一列)"></div>

5.listview

  无序:

  <ul data-role="listview">

    <li>a</li>

  </ul>

  有序:ol

  过滤的效果(搜索框)

6.navbar

7.popup(弹出窗口)

8.selectmenu

9.jQuery Mobile事件(滑动,长按等等)

时间: 2024-08-05 18:00:51

第十三篇、jQuery Mobile的相关文章

第二十三篇 jQuery 学习5 添加元素

jQuery 学习5 添加元素 同学们,这节课,使用jQuery动态添加元素,是很关键的一课,一般用在什么地方呢:别人发表一篇文章,你评论楼主的时候,总不能是提交表单,到后台的其他页面处理,然后再刷新回来吧,这样的话,用户体验不好.考虑一下用户的计算机配置不好.网络不好等多个因素,总是刷新页面,会造成等待的时间太长.甚至有的浏览器直接刷新不出来了,那么用户就抓狂了,就对你的产品有怨言. 所以,我们做前端,要实现动态添加,以后再使用ajax这类异步刷新和后台交互就可以了,那么多的不说,我们现在学的

jquery mobile自定义webapp开发实例(一)——前言篇

用jquery mobile做了一段时间的webapp开发,准备用自己的一个小demo做一个模块化的分享 点击demo演示 手机演示二维码: 此demo已经是比较老的版本,用户体验流畅度确实还存在很大的问题,但在我写这一系列的webapp开发实例后,将会解决大部分问题 下面是以后准备写到的一些点: 1:谈谈关于jquery mobile 一些常见问题的解决.(常见问题的解决查看) 2:jquery mobile实现多页面跳转(不是官网上那样把所以的page在一个.html文件内,而是每个page

jquery mobile自己定义webapp开发实例(一)——前言篇

用jquery mobile做了一段时间的webapp开发,准备用自己的一个小demo做一个模块化的分享 点击demo演示 手机演示二维码: 此demo已经是比較老的版本号,用户体验流畅度确实还存在非常大的问题,但在我写这一系列的webapp开发实例后,将会解决大部分问题 以下是以后准备写到的一些点: 1:谈谈关于jquery mobile 一些常见问题的解决.(常见问题的解决查看) 2:jquery mobile实现多页面跳转(不是官网上那样把所以的page在一个.html文件内,而是每一个p

微信开发订阅号(ASP.NET MVC4+jquery mobile+AppHarbor发布)

首先应该去微信公众平台注册一个账号,因为我是用的个人,所以只能注册订阅号,然后需要提供身份证照片,这些大家慢慢折腾.然后在微信管理面板中选择高级功能,进入开发者模式. 在服务器配置中需要提供最重要的url,用来接收微信发过来的消息和回复消息,token这个随便填一个就行了,主要是用来验证消息来源. 如果你是java php开发者,那么你可以选google AppEngin 或者sina app engine 来部署你的应用,但是很不幸,我是.net,这里我们使用国外的AppHarbor,appH

Jquery Mobile 中绑定事件

今天遇到了jmobile中绑定事件的问题, 参考:http://liyunpeng.iteye.com/blog/1964165 对页面中的绑定事件有了大概了解,不过这篇帖子年代久远,很多不是很详细,特此记录. 首先查到jmobile中的所有可以用.on()动态绑定的所有事件, 详情参考:http://www.runoob.com/jquerymobile/jquerymobile-ref-events.html 按以前的理解照抄,结果死活出不来效果,认真查看示例发现需要加"pageinit&q

jQuery Mobile 脚本加载问题

刚开始使用jQuery Mobile,发现很多问题需要重新考虑,比如脚本加载问题. 在普通html中,如果a.html中有链接到b.html,b.html中有类似代码: $(document).ready(function() { alert("hello"); }); 则这段代码可以被正常执行. 而在jQuery Mobile中,这样做就行不通了,在浏览器中直接刷新b.html,则代码可以正常执行,而从a.html跳转到b.html时则不会被执行!为什么? 参见: http://ww

jQuery Mobile十大常用技巧

目前,在移Web开发领域中,除了使用如Android,iOS系统原生提供的API进行开发外,对于Web开发人员来说,最方便快捷的方法莫过于使用比如jQuery Mobile,Sencha Touch这样基于HTML 5的Web框架进行开发了,因为只要熟悉CSS,JavaScript则可以很轻松地运用这些移动Web开发框架进行开发. AD: 在本文中,将介绍使用jQuery Mobile开发的一些常用的技巧,阅读对象为已经使用过jQuery Mobile进行开发的移动Web开发者. 1.禁止截断过

两大HTML5框架评测:Kendo UI 和 jQuery Mobile

jQuery Mobile 和 Kendo UI 都是流行的 JavaScript 框架,在开发中我们可以在它们的基础上添砖加瓦制作所有现代移动WEB应用.这两个框架都是基于使用率顶尖的 JavaScript 库 jQuery 所构建的.比较 Kendo UI 和 jQuery Mobile 有些类似于比较同一枚硬币的两面.众所周知,jQuery Mobile 实际上并不需要太多的介绍,因为它是最常用的HTML5框架之一. Kendo UI 具有相似的动机和类似的发展速度.与 jQuery Mo

自学JQuery Mobile的几个例子

JQuery Mobile是一个用于构建移动Web应用程序的框架,适用于主流的移动设备(智能手机.平板电脑),该框架利用了HTML5和CSS3技术减少了额外的脚本文件的编写.具体JQuery Mobile使用请转W3C页面:http://www.w3school.com.cn/jquerymobile/index.asp 例子:该例子创建了一个介绍海贼王故事的一系列页面 ex1.html文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra