JQM

应用名称 ：kLink通讯录 应用URL地址 ： http://klink.sturgeon.mopaas.com/ 应用说明及使用场景 ： kLink是一个简单、直接、纯粹的通讯录应用，支持PC浏览器、android、ios、windows phone等平台； 目前kLink正在我效力的企业中使用，方便同事们之间的查找与沟通; 目前交付的kLink作品是一个阉割版，去掉了短信及企业通讯录同步功能； 开发kLink的初衷是通过快速部署使企业瞬间拥有通讯录应用，便于同事间查找与沟通。 应用所使用的技术及软件 ： kLink使用JQueryMobile框架进行构建与开发，借助JQueryMobile框架进而实现全平台的支持; 服务器端使用servlet+spring来提供数据的存取；前后台通讯使用AJAX技术。 另外该应用可借助Phonegap等工具将其封装成手机应用。 说明： 为了方便大家进行测试，本程序屏蔽了登陆验证逻辑，随便输入登录信息点击登录按钮即可进入主界面 创新点 ： 支持全平台访问； 快速部署，瞬间使企业拥有通讯录应用； 应用截图： 主界面 登陆界面 查找联系人界面 管理联系人界面 发邮件界面 希望大家喜欢! 按照国际惯例，该项目已开源，详情请点击 http://my.oschina.net/kzhou/blog/186018 来源： oschina 链接： https:

好几天没有写博客了，最近在学习 backbone 为下一个项目做准备。 想想我从.net转向 前端工作已经有半年了（2014-3月份开始），我对 javascript这门语言本身是非常喜爱的，而且我也对 APP开发比较感兴趣，所以也不知道是因为巧合还是怎么的我就稀里糊涂的进入了 webApp 前端的开发工作！ 想想在从事此工作之前我也很彷徨过，有一度的时间，我想放弃过从事IT行业的工作，但是始终自己没有那个勇气。 再说说目前我看过的一篇报道，2017年，穿戴式设备将会普及全世界 70%，想想到那时候，人民全是带着手表，不再玩手机，那 webApp还存在吗？毕竟一个穿戴设备可不会支持浏览器。 好了，说的太多的废话，下面讲讲我从事半年 web 前端所终结的经验。 记得，从来公司那会，公司一个项目说直接给我做，当时真是一头雾水，而且感觉压力很大啊，比较从未有过这方面的经验，就赶鸭子上架了，当时我们的项目经理做技术选型的时候说用JQM框架，还好，在2013年的时候，我特地买过一本书了解过前端的框架，书中主要讲的是：Jquery Mobile和senche touche 还有phonegap打包。 从UI那边接过来 PSD图之后，就让我切图，当时就泪流满面了，我哪会切图啊。%>_<%，经过一番讨教和学习终于学会了前端最基本的技能---切图。 然后我就开始做了，因为要做手机端啊

此文章将会持续更新，主要收录一些新手比较常见的问题。 欢迎 向我推荐 比较典型的常见问题，我会记录并整理进文章，方便自己更方便大家。 文章导读： 1、页面缩放显示问题 2、页面跳转后样式丢失js失效 3、跳转时重复调用pageinit方法的解决办法 4、如何调用loading效果 5、动态改变了list的内容，但是内容并没有变化 6、把所有内容放到一个页面好,还是分开多页面好 7、如何禁掉ajax跳转 8、为什么android2.3系统转屏无效果？ 9、如何去掉jqm自带的组件样式？ 10、jquery mobile “闪屏” 问题 2013/4/30 更新内容： 11、按钮按下/划过的状态感觉反应有些迟缓？ 2013/5/1 更新内容： 12、jquery mobile各类组件刷新方法 2013/5/7 更新内容： 13、在页面动态添加组件，发现css消失了 2013/5/22 更新内容： 14、关于checkbox取值问题 2013/5/28 更新内容： 15、点击屏幕，header和footer会略微抖动？ 2013/6/20 更新内容： 16、jqm图标|图标定位|隐藏图片上的文字|去除图标阴影|自定义图标|去除按钮阴影/圆角 17、jqm组件显示正常，但是小图标是“空的”，没有正常显示 18、$.mobile.changePage方法不能正常跳转 1 页面缩放显示问题

框架整理： (1)jQuery是一个JS函数库，简化了DOM&AJAX操作，本质与DOM相同 WriteLess，DoMore。 (2)jQueryUI是一个HTML组件库，丰富了HTML的功能。 (3)Twitter Bootstrap是一个HTML/CSS/JS框架，简化了响应式网页的编写，提供了栅格系统+CSSReset+HTML组件。 (4)Google AngularJS是一个JS框架，改变了网页的编写方式，适用于以数据操作为主的SPA应用。 (5)jQueryMobile是一个HTML组件库，适用于移动App的开发。 bootstrap：脚步、起步、引导程序 1.jQueryMobile概述 jQuery Mobile is a HTML5-based user interface system designed to make responsive web sites and apps that are accessible on all smartphone, tablet and desktop devices. 主要内容可以分为四个部分： (1)页面&导航 (2)CSS框架 (3)组件 (4)表单组件 2.使用jQM的步骤 (1)项目中引入jquery 1.8+ (2)项目中创建jqm目录，引入jqm必需资源文件 jquery-mobile.css jquery

前言 上个月我设计一个基于JQM的webapp作为我的毕业设计 jQuery moible 开发笔记之项目设计 http://www.cnblogs.com/youxilua/archive/2012/01/03/2310963.html 结果…当然是做完了…效果嘛,作为毕业设计还可以,但是实际使用起来实在不给力,例如,窗口的浮动,流量的消耗,还有对于设备配置的依赖(例如,在局域网中HTC 野火跑起来那叫一个慢死…),不过,在一些高端设备运行还可以,例如,小米(我们班还是挺多人买了),iphone,三星的银河系列… 工欲善其事,必先利其器 我们没必要学习苦行僧那样,用记事本来打代码.目前而言呢,phonegap的IDE工具最好的当然是DW CS 5.5. 不过,我这里使用eclipse作为我的开发IDE,因为之前使用过DW CS 5.5 ,这次就换个IDE工具. Eclipse 的配置 1,一站式新建项目 phonegap + jqm http://svn.codespot.com/a/eclipselabs.org/mobile-web-development-with-phonegap/tags/r1.2/download/ 这个插件还是很给力的,已经支持默认支持最新版本的phonegap,jqm,sencha 安装完以后选择这个图标 2,选择要建何种类型的phoneGap

摘要:[JQM][003][MVC 4 Mobile Features]建立第一个jquery mobile行动网页 首先根据上篇 [JQM][002][MVC 4 Mobile Features]Overriding Views,Layouts,and Partial Views 建立起.mobile.chtml网页 然后安装nuget的jquery.mobile.mvc套件： 安装完毕之后，马上出现以下提醒，这是告诉你，要把这一行程序加入到Gloabal.asax才可以使用默认的mobile template 当然我们就按照他的指示去加入： BundleMobileConfig.RegisterBundles(BundleTable.Bundles); 不过，安装的同时，也出现提示，我们的_Layout.mobile.cshtml也被覆盖掉了，其实只是改引用jquery mobile的js函数库跟css而已 安装完毕不代表行动网页就完成了，但是至少再看一下行动版的画面的时候，css已经套用为jquery mobile版本了： 接下来TestOverride.mobile.cshtml还要改成jquery mobile专用的html： table的部分，要改用ul, li去做，而ul要加上属性data-role="listview" @model IEnumerable

两者都是不错的JS编程框架，但是各自用途不同 1. jQuery Mobile提供了不错的图形空间，以及依赖于jQuery本身，提供了不少空间操作的API 2. Angular没有啥控件，但是是一个很好的JS的MVC框架，以及提供了空间的数据绑定功能。 于是，开始有些开源的项目把两者整合在一起，比如 https://github.com/opitzconsulting/jquery-mobile-angular-adapter 但是有了这个adapter，两者就可以很好的工作了么，NO。有些问题，比如 两者page加载方式是不一样的，对于每个page, Angular是导航的使用route在需要的时候把page片段加载到浏览器的，URL类似于http://angular.github.io/angular-phonecat/step-7/app/#/phones/motorola-xoom-with-wi-fi，注意在#后面才是真正的资源地址，然后初始化资源对应的controller,，这样你可以初始化显示数据。然后jQuery Mobile是需要一次性把所有page都加载到客户端。这样子的话，如果如果在jQuery Mobile中你为每个page定义一个angular的controller，那么初始化你的angular controller的时候页面还未显示 我们需要一个设计实现