`
flex_莫冲
  • 浏览: 1092020 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

jqury mobile的缺点

 
阅读更多
1 jq的a和input按钮的样式不一致。button和submit类型的按钮样式不一致。导致同一行的按钮高低不一致要自己手动修改。
2 a按钮由jq初始化后,外套了div,但是div没有继承a的class或id,而a标签又被隐藏了,这样就无法直接选择到该按钮,必须通过父元素获取子元素的方式设置css或js
3 jqm的页面跳转默认采用当前页面加载目标页面html和js,cas的方式,这样容易出现错误并且难以调试,增加了页面间的耦合。而且这个坑还不容易发现。
4 jquery mobile的panel功能。在<a>标签中定义了href="#right-panel",打开panel但是不会更改url为xxx#right-panel。这样就没法做router事件来定义路由功能。只能手动更改url为xxx#right-panel。然后再用路由来实现路由功能。
这种更改了html本身功能的做法,实在是很操蛋啊。
设置了url的hash后。close panel要清空hash可调用
location.hash = $.mobile.path.makeUrlAbsolute();清空。

5 若form的元素是动态用js生成的,则需要调用create函数生成,但是不支持直接使用.textinput("create"),而必须这样写
$("#pushTime").textinput({"create":function(){}});

很古怪的感觉

若是生成datebox就更奇怪了,因为datebox也是个input元素,所以必须先初始化input再初始化datebox。如下xiefa
function initPushTime() {
		var timeContainer = $("#timeContainer");
		var timespinnerHtml = "<input type=\"date\" name=\"pushTime\" id=\"pushTime\"  data-role=\"datebox\" placeholder=\"推送時間\" " +
			" class=\"required\" 	data-options='{\"mode\": \"timebox\", \"overrideTimeFormat\": 24}' readonly=\"readonly\"/>";
		timeContainer.append(timespinnerHtml);
		$("#pushTime").textinput({"create":function(){}});
		$("#pushTime").datebox();
	}


若是执行了destroy后,还会留下一堆html元素,还得手动处理掉这些剩余的html元素。
用起来真是很恶心。
执行$("#pushDate").datebox("destroy");
还有一堆
<div class="ui-input-text ui-shadow-inset ui-corner-all ui-btn-shadow ui-body-b"><div class="ui-input-datebox ui-corner-all ui-body-b" style="border: medium none;"><input type="date" readonly="readonly" data-options="{&quot;mode&quot;: &quot;calbox&quot;, &quot;overrideCalStartDay&quot;: 1, &quot;overrideDateFormat&quot;:&quot;%d-%m-%Y&quot;, &quot;usePlaceholder&quot;:true}" class="required ui-input-text ui-body-b" placeholder="推送日期" data-role="datebox" id="pushDate" name="pushDate"><a title="Open Date Picker" class="ui-input-clear ui-btn ui-btn-up-b ui-shadow ui-btn-corner-all ui-btn-icon-notext" href="#" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="grid" data-iconpos="notext" data-theme="b" style="vertical-align: middle; display: inline-block;"><span class="ui-btn-inner"><span class="ui-btn-text">Open Date Picker</span><span class="ui-icon ui-icon-grid ui-icon-shadow">&nbsp;</span></span></a></div></div>
分享到:
评论

相关推荐

    JQueryMobile_开发常见问题操作手册|教程

    **jQuery Mobile 开发常见问题操作手册** jQuery Mobile 是一个专门针对移动设备的 UI 框架,它基于 jQuery 库,旨在提供跨平台、跨浏览器的一致用户体验。它包括一系列预定义的 UI 小部件、触摸事件处理和自动页面...

    jQuery Mobile

    ### jQuery Mobile:构建跨平台移动Web应用 #### 一、简介与概述 jQuery Mobile 是一个基于流行的 jQuery JavaScript 库的框架,旨在创建适用于多种设备的移动 Web 应用程序。随着移动互联网的发展,应用程序可以...

    jQuery Mobile页面返回不需要重新get

    首先,本文的核心内容是关于jQuery Mobile框架下,页面在返回时无需重新进行get请求的方法。jQuery Mobile是一个基于HTML5和CSS3的前端开发框架,特别设计用于开发移动Web应用。在使用jQuery Mobile开发webapp项目时...

    实训 jQuery开发交互效果页面--留言页面.pptx

    10. jQuery 的缺点:使用 jQuery 也有一些缺点,例如:可能会增加页面加载时间、需要学习 jQuery 的语法和方法等。 在本资源中,我们使用 jQuery 来开发一个留言页面,包括留言显示区域和留言发布区域。我们使用 ...

    jquery mobile changepage的三种传参方法介绍

    在jQuery Mobile中,`changePage`是一个非常重要的函数,它用于在单页面应用程序(SPA)中导航至不同的页面。然而,尽管`changePage`提供了许多选项(options),但实际传递参数的方法并不像初看起来那么简单。根据...

    Jquery学习教程

    - **jQuery引入**:学习如何在HTML页面中引入jQuery库,理解`&lt;script&gt;`标签的使用以及CDN链接的优缺点。 - **jQuery选择器**:了解基本的选择器,如ID选择器、类选择器、元素选择器,以及更复杂的组合选择器和属性...

    移动应用框架比较

    本篇文章将详细比较三个主流的移动应用框架:jQuery Mobile、jQTouch 和 Sencha Touch。 首先,jQuery Mobile 是基于 jQuery 的一个轻量级框架,专为触摸优化的网页设计而生。它提供了丰富的 UI 组件,如导航栏、页...

    HTML5课程方案(企业培训).pdf

    3. **JQueryMobile表单组件、列表**:如何利用JQueryMobile优化表单和列表的显示和交互。 4. **JQueryMobile事件**:如`pageinit`、`pageshow`等,用于处理页面生命周期中的事件。 PhoneGap章节则关注混合应用开发...

    实现你的移动战略-Implementing Your Mobile Strategy

    8. **框架与内容管理系统的选择**:根据具体需求选择合适的框架(如jQuery Mobile)或CMS(如WordPress),以加快开发进度并确保兼容性。 9. **提出问题**:在制定移动战略时,需要不断提问并寻找答案,比如“我们的...

    jQuery 判断是否移动端访问.docx

    无论是检测窗口宽度还是分析用户代理字符串,都有各自的优缺点。在实际应用中,开发者应根据项目的具体需求和预期的用户体验来决定采用哪种方法。同时,考虑到各种设备和技术的发展变化,建议定期对检测逻辑进行评估...

    用一个URL加一个JAVA壳做成一个安卓应用

    用一个URL加一个JAVA壳做成一个安卓应用 ... 版本: v2.0 若想获得更新版本欢迎加入我们...2、应用使用jquerymobile,有小的闪屏效果 若有什么问题,请加我们QQ群,请不要给我们发邮件,有事情到QQ群里一起讨论学习

    PhoneGap 文档

    1. **示例**:通过使用jQuery Mobile创建一个简单的应用,并使用PhoneGap将其打包成可安装的跨平台移动应用。 2. **测试浏览器**:介绍适用于移动应用开发过程中的测试工具和浏览器,确保应用在各种设备和环境中正常...

    WEB前端简历模板14.doc

    * 熟悉 JQuery、Bootstrap、AngularJS、jQuery-mobile 等框架 * 熟悉 php、mysql 等相关技术 * 了解 Android 移动端开发项目经验 项目经验 * 京东首页和详情页开发:使用 HTML、CSS、JavaScript 等技术,完成页面...

    Drupal手机移动建站架构

    DrupalGap是一个将Drupal、PhoneGap和jQuery Mobile结合在一起的项目,实现了在移动设备上的原生应用体验。Mobile App Generator (MAG)是一个快速搭建移动应用的工具,***则是一个第三方平台,帮助开发者将现有网站...

    HTML在LBS社区中的应用PPT教案.pptx

    为了应对这些挑战,开发者可以利用各种框架和工具,如Sencha Touch、JQTouch、jQuery Mobile等,来简化HTML5 Web App的开发。这些框架提供了丰富的组件和良好的用户体验,但也各有其特点和适用场景。例如,Sencha ...

    编程狂人第五期

    3. jQuery Mobile 1.4:这是一个流行的前端开发框架的新版本,它的正式发布意味着开发者可以利用更新的功能和优化来提升移动Web应用的用户体验。 4. NodeJS:文章列举了10个使用NodeJS实现的令人惊讶的开源项目,...

Global site tag (gtag.js) - Google Analytics