jquery mobile小经验
现在网站上关于jquery mobile的demo和帖子可真少啊,我刚开始接触,遇到了一些问题,都找不到人请教。
这是我的个人经验总结,或多或少会对刚入门的童鞋有点帮助吧。
如果想一开始进入页面的时候就弹出来一个警告框,目前我知道的有三种办法可以解决:
1.利用jqm因为jqm的加载远早于document.ready事件发生时,当Jquery Mobile开始执行时,他就会在document对象上触发mobileinit 事件,所以你可以绑定别的行为来覆盖默认配置
- $(document).bind("mobileinit", function(){
- alert("jquery mobile");
- });
因为mobileinit事件是在加载后马上触发,所以你需要在Jquery Mobile加载之前绑定你的事件处理函数,所以我建议你如下安排你的js引用顺序
- <script src="Jquery.js"></script>
- <script type="text/javascript">
- $(document).bind("mobileinit", function(){
- alert("jquery mobile");
- });
- </script>
- <script src="Jquery-mobile.js"></script>
最好是按照这个顺序,因为我开始的时候,是这样写的:
- <script src="Jquery.js"></script>
- <script src="Jquery-mobile.js"></script>
- <script type="text/javascript">
- $(document).bind("mobileinit", function(){
- alert("jquery mobile");
- });
- </script>
但是根本就没有任何反应,也不报错,所以顺序很重要哈!
2.利用jquery$(function(){
alert("jquery");
})
3.利用javascript
- function loaded(){ alert('javascript'); }
- document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 2000); }, false);
此外,还有一种页面跳转的方式,如果你想从第一个页面通过后台跳转到第二个页面的时候,弹框框,那么你可以用这种方式:
第一个页面的链接:
- <a href="${pageContext.request.contextPath}/lcecodelog/listL_cecodelog.action class="ui-btn-active" data-ajax="false">跳转页面</a>
第二个页面:
- <script src="Jquery.js"></script>
- <script src="Jquery-mobile.js"></script>
- <script type="text/javascript">
- $(function(){
- alert("第二个页面");
- });
- </script>
- 或者
- <script src="Jquery.js"></script>
- <script src="Jquery-mobile.js"></script>
- <script type="text/javascript">
- $(document).bind("mobileinit", function(){
- alert("第二个页面");
- });
- </script>
因为jqm默认的提交方式是ajax,但是我在这里不是用ajax提交的,所以需要设置data-ajax="false"属性,这样才可以正常弹出框框,否则也是没反应的。
- <script type="text/javascript">
- $(document).bind("mobileinit", function(){
- $("#jiangjie").bind("click", function() {
- //如果使用的$("#jiangjie").click(function(){});那么就需要写在$(function(){})里面,不支持click事件吗?还是绑定事件吧
- alert("产品讲解");
- });
- });
- </script>
jquery mobile小经验的更多相关文章
- jquery mobile小案例
---恢复内容开始--- [jquery mobile小案例]效果图如下: 首先先创建一个页面主要使用data-role="page"这个指令,我们给它起个id="pag ...
- phoneGap+jquery mobile项目经验
最近一个月,一直在用phoneGap+jquery mobile来开发一项目. 下面谈谈自己在开发过程中遇到的一些问题以及解决方法. 开始选择框架时,曾试过采用其他框架做UI,例如chocol ...
- JQM[jquery mobile] 实战经验汇总
动态装载的子页面(data-role=”page”),完全不用page div之外的tag,也不会起作用.子页面的javascript脚本必须写在page的</div>之前. 切换按钮(a ...
- JQuery Mobile 的引用代码,以及在手机浏览器上字体太小的解决办法
JQuery Mobile 的引用代码: <link rel="stylesheet" href="http://code.jquery.com/mobile/1. ...
- jQuery Mobile中文手册:开发入门
jQuery Mobile 以“Write Less, Do More”作为目标,为所有的主流移动操作系统平台提供了高度统一的 UI 框架:jQuery 的移动框架可以让你为所有流行的移动平台设计一个 ...
- Android+Jquery Mobile学习系列(2)-HTML5/Jquery Mobile基础
本章介绍两个关键字[HTML5]和[Jquery Mobile],简单说这两者的关系是:HTML5作为主体,Jquery Mobile在HTML5的基础上对其进行了优化.装饰. HTML5 HTML5 ...
- jQuery Mobile入门
转:http://www.cnblogs.com/linjiqin/archive/2011/07/17/2108896.html 简介:jQuery Mobile框架可以轻松的帮助我们实现非常好看的 ...
- Jquery mobile 新手问题总汇
1页面缩放显示问题 问题描述: 页面似乎被缩小了,屏幕太宽了. 解决办法: 在head标签内加入: <meta name="viewport" content="w ...
- 学jQuery Mobile后的感想
jQuery Mobile是jQuery 在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架.支持全球 ...
随机推荐
- weblogic 内存 及 内存溢出
. 区分JVM虚拟机选项:Xms Xmx PermSize MaxPermSize JVM限制:相关操作系统的数据模型(32-bt还是64-bit)限制:系统的可用虚拟内存限制:系统的可用物理内存限制 ...
- 七彩花都手机客户部分测试源码Phonegap+html5
个人建设广州花都论坛,七彩花都(http://www.w30.cn)包含传值回复楼层的jsonp 可以加入我们的QQ群讨论 专注phonepap 核心加载 jsonp返回格式为 jsonp([{&qu ...
- 算法笔记_038:特殊回文数(Java)
目录 1 问题描述 2 解决方案 2.1 80分解法 2.2 网友标答解法 1 问题描述 问题描述 123321是一个非常特殊的数,它从左边读和从右边读是一样的. 输入一个正整数n, 编程求所有这 ...
- iOS主题/皮肤之SakuraKit
概述 目前市场上很多 App 都有主题变更.皮肤切换的功能.随着项目代码量的不断增长,业务不断完善,功能性代码逐渐趋于模块化,尤其是在多人协作开发同一个项目时,模块解耦尤为重要,同时,公共基础库的功能 ...
- c#通过FileStream读取、写入文件
网上找过一些FileStream读取写入文件的代码,但是都有些小问题. 于是自己整理一下,以备不时之需.说明一下,以下代码我都运行过. 1.FileStream读取文件 // FileStream读取 ...
- IO多路复用之epoll
1.基本知识 epoll是在2.6内核中提出的,是之前的select和poll的增强版本.相对于select和poll来说,epoll更加灵活,没有描述符限制.epoll使用一个文件描述符管理多个描述 ...
- GraphicsMagick 学习笔记
两种最常用的图片处理工具:GraphicsMagick 或 ImageMagick,GM是IM的分支,这两个图片处理工具功能基本相同,各有特色.但他们并不是nodejs的插件,它们都是客户端软件,li ...
- hibernate 中集合的保存
一.开发流程 1)引入jar包,注意引入数据库驱动包 2)创建数据库表 //创建用户表 CREATE TABLE USER( id INT PRIMARY KEY AUTO_INCREMENT, un ...
- Cocos2d-x3.0游戏实例之《别救我》第六篇——从代码中获取UI控件
这篇的内容非常easy,获取UI控件,然后使用它. 还记得我们在UI编辑器中给三个button分别命名了吧? 如今要用上了. 笨木头花心贡献,啥?花心?不呢,是用心~ 转载请注明,原文地址: http ...
- 【Android】15.0 第15章 广播和通知—本章示例主界面
分类:C#.Android.VS2015: 创建日期:2016-02-28 一.简介 广播(Broadcast):其功能类似于收音机的广播,你只要调到那个台(只要在接收的类中注册了要接收的广播),就能 ...