【初识 JQMobile 小小总结】
作为一个前端新手,之前还没有接触过手机端的项目。两周前项目经理告诉我要做手机端,让我用JQMobile。
之前在前端群里,偶尔听说过jqmobile很坑,自己又查了下其他框架,比如zepto、amazui,这两款是大家比较推荐的。
和经理提了一下,经理说就用jqmobile吧,看来他还是比较相信JQ的。不过我心里还是有很多担心,不过也没关系,就算是坑,
也得自己去跳跳才知道,况且也肯定会有收获的,不被坑,怎么知道哪里坑?
第一天我花时间看了一下API,第二天就让我开始写页面了。一直对于jqmobile的API不满意,感觉始终不全,我查文档得在三个地方查:
W3C.cc、官方API和下载框架自带的demo,感觉自带的demo要全面一点,不过这三个加起来始终还是不全。
jqmobile虽然大,但确实也比较全,几乎自己不用写样式。对于我现在这个时间急的项目,其实还挺合适。
因为它有很多结构定的比较死,比如:listview,当时我也真是头疼,需要往里面添加东西怎么都不合适,甚至让我觉得这果然是个坑。
冷静下来,还是得仔细看它的源码,最后利用css优先级,自己扩展代码,解决了这个问题。
如下:我把listview的两列结构,添加了一列变成3列了,并覆盖了它的图标替换成我想要的复选框。
这里本身是总结,就不做具体代码展示了,看下节点吧:
<ul data-role="listview" ><li data-role="list-divider" data-theme="b">listview</li><li class="ui-li-has-alt ui-li-has-thumb"><a href="" class="ui-btn-3-1 ui-btn"><img src="{$vo.img_url}"/><h2>{$vo.title}</h2></a><div class="ui-btn ui-btn-3-2"><p></p><h4>count</h4><div data-role="none" class="selectNumber-gruy"><span id="reduceNum" class="selectNumberBtn noSelect" data-role="none">-</span><input id="numInput" type="text" name="num[]" class="selectNumberInput" autocomplete="off" value="1" maxlength="8" title="数量选择" data-role="none" readonly="readonly"><span href="javascript:void(0);" id="addNum" class="selectNumberBtn" data-role="none">+</span></div></div><span class="ui-btn ui-btn-3-3"><input type="checkbox" autocomplete="off" name="id[]" /></span></li></ul>
自定义或扩展样式是难免的,不过一定要小心可能会带来的问题,而且一定要确保没有遗漏一些细节。解决了这个问题,突然就觉得jqmobile真的挺好了。虽然它那么大。
关于jqmobile的ajax提交机制,虽然绚丽一点,但实在有点影响我的js,直接全局禁了。禁用绑定要放在JQ之后,mobile.js之前。
<script type="text/javascript" src="__STATIC__/jquery.min.js"></script> <script>$(document).bind("mobileinit", function() {// global ajax stop$.mobile.ajaxEnabled=false;});</script><script type="text/javascript" src="__JS__/jquery.mobile-1.4.2.min.js"></script>
以上这两个问题估计是我刚接触时最头疼的问题。
jqmobile的弹窗popup和面板panel,是我挺喜欢的两个东西,总之它实实在在的加快了我开发的效率,不过现在才用它两周,项目还未收尾。还没考虑到最后的优化问题,
估计到时候要把自己折磨死。
说实话,除了JQ,我一般很少用框架,插件都是自己写,而且只要是公用的要封装的插件,我都用原生JS写。目的很简单,把基础打牢一点,虽然这样并不利于一些维护和别人辨识你的代码。
我知道大量用框架是迟早的事情,但是作为新手,我还是暂时尽量自己原生实现一些功能。有兴趣可以看看我的其它博客里发表的插件。
这次算是初次使用这类框架,有很多收获:
1.看框架源代码,能学到很多思想,结构的把控。
2.关于css,js命名等,本身自己英语不好,看了老外的命名,纠正了自己的一些命名错误。
3.感受到了框架开发速度的快感,不过无论如何,还是先得有较好的基础,这样才真正的谈得上快感。
4.使用框架后,发现自己更加容易懒于去写代码,这是需要注意的问题。
5.不管一个框架好不好,至少我又了解了一个,以后又多一个可以用来对比的框架。
好吧,今天就这么多了。有兴趣的朋友,可以私下交流哈。
转载于:https://www.cnblogs.com/1wen/p/4234219.html
【初识 JQMobile 小小总结】相关推荐
- 1、零基础学工控——初识plc
☞☞☞点击查看更多优秀工控PLC博客☜☜☜ 大家好我是你们的朋友JamesBin,从今天开始我们将一起学习西门子的PLC这个自动化工具,这节课就让我们来一起看看什么是PLC吧! 初识plc 什么是PL ...
- 小小黑客之路(一)——端口扫描器
在之前了解过黑客,曾经在网易上写过一篇关于黑客的文章--<黑客初识>,由于各种原因没有继续学习去,由于前几天的机房讲课,又激起我那不安的心,故找到一本<小小黑客之路>进行学习. ...
- 【深入理解 android telephony 系列第一集 初识telephony】
深入理解 android telephony 深入理解 android telephony 系列第一集 初识telephony 1. 概述 2. Android Telephony 框架 3. And ...
- 初识EMC元器件(六)——磁珠的参数解读及选型应用
一.什么是磁珠 磁珠的全称是铁氧体磁珠滤波器,是一种抗干扰元件,消除高频噪声效果明显.注意:磁珠的单位是Ω,而不是H.等效于电阻和电感串联,Z=R+jX,但电阻值和电感值都随频率变化. 滤波原理:在低 ...
- 2020年,小小程序员平庸但不怂的一年
别人的2020忙着写了好几本掘金小册: 大叔连写小册的资格都没有. 别人的2020,40万粉丝,却依然谦称道:小小程序员平凡的一年: 2020大叔有103位"掘金关注者",只能自称 ...
- 初识随机规划:用一个小例子理解随机规划
文章目录 初识随机规划:一个小小例子 生产计划的例子 参数的不确定性 随机规划模型(Stochastic Programming) Python调用Gurobi求解随机规划模型 参考文献 Olittl ...
- python原生是什么意思_python小课堂31 - 初识原生爬虫
python小课堂31 - 初识原生爬虫 前言 在上一期介绍了爬虫之前必会浏览器的开发者工具,忘记的童鞋可以在回顾一下: 本篇文章将以实战来介绍一期 "原生" 爬虫,这里的原生是指 ...
- 【python小课堂专栏】python小课堂31 - 初识原生爬虫
python小课堂31 - 初识原生爬虫 前言 在上一期介绍了爬虫之前必会浏览器的开发者工具,忘记的童鞋可以在回顾一下: python小课堂30 - 爬虫之前必会的浏览器开发者工具. 本篇文章将以实战 ...
- day3----编码-集合-深浅copy-文件操作-函数初识
day3----编码-集合-深浅copy-文件操作-函数初识 本文档主要内容: 一 编码 二 集合 三 深浅copy 四 文件操作 五 函数初识 首先,我们来看看两个字符串的比较 打开cmd,进入do ...
- ⑥python模块初识、pyc和PyCodeObject
一.模块初识(一) 模块,也叫库.库有标准库第三方库. 注意事项:文件名不能和导入的模块名相同 1. sys模块 import sys print(sys.path) #打印环境变量 print(sy ...
最新文章
- leangoo敏捷工具卡片关联上线
- android 蓝牙数据分包_无线组网技术谁能问鼎云巅-蓝牙Mesh, ZIGBEE, THREAD
- haproxy参数优化
- 信号 频率_信号的时间域分辨率和频率域分辨率
- 《剑指offer》c++版本 15.二进制中1的个数
- slf4j 记录日志文件_教程:正确的SLF4J日志记录用法以及如何检查它
- ObjectStreamClass:监视Java对象的序列化
- 好棒,测试妹子都能看懂的Jenkins Docker安装教程
- 在MongoDB的MapReduce上踩过的坑
- c语言代码大全和详细解释_最详细的Simulink代码生成(C语言)
- linux导入多个文件到myql
- 【转】RIS/PACS系统实施过程中Worklist的配置与调试
- C6678之外部存储器接口EMIF
- php在线中文转英文,thinkphp页面的多语言切换,中文、英文之间的转换
- 恶魔奶爸语法4-6课
- 360网站查杀php专版,360网站木马查杀插件上线:可检测Struts2漏洞
- Flink Interval Join使用以及源码解析
- 肯德基 服务器响应异常,肯德基链接服务器异常
- 开源spider一览(zz)
- Python爬取微信公众号文章、标题、文章地址