移动开发app有用例子.docx

移动开发app有用例子以下摘录自网络:作者：phonmy 发布：2013-01-12 分类：WEB前端, 移动端 javascript(简称js)语言在移动前端应用很广。可以说必不可少，许多效果都是和js相关的。包括现在移动端的一些框架。jqmobi、jqtouch、sencha touch、jquerymobile等等。这些都是基于js而进行编写的。这篇暂时不讨论这些框架。以后会慢慢介绍其中的一两个框架的具体使用方法。这篇主要讨论一下部分常用的js事件在移动端的使用。举几个例子：1、隐藏地址导航栏：/ 该函数由Simon Willison编写,它只有一个参数,该参数表示被调用的函数名(在页面加载完毕时执行的函数的名字)function addLoadEvent(func) var oldOnload = window.onload;if (typeof window.onload != function) window.onload = func;else window.onload = function() oldOnload();func();/ 添加Load事件处理addLoadEvent(hideMenu);function hideMenu() setTimeout(“window.scrollTo(0, 0)”, 1);以上代码是针对IOS系统的移动端收缩地址导航栏作用的（部分安卓机也可以）。核心代码其实就是一句：setTimeout(“window.scrollTo(0, 0)”, 1);利用定时器，将窗口移动到内容端的最上端。从而隐掉地址导航栏。2、判断手机横竖屏状态：function hengshuping()if(window.orientation=180|window.orientation=0)alert(“竖屏状态！”)if(window.orientation=90|window.orientation=-90)alert(“横屏状态！”)window.addEventListener(“onorientationchange” in window ? “orientationchange” : “resize”, hengshuping, false);移动端的浏览器一般都支持window.orientation这个参数，通过这个参数可以判断出手机是处在横屏还是竖屏状态。从而根据实际需求而执行相应的程序。通过添加监听事件onorientationchange，进行执行就可以了。3、判断是否是从主屏幕图标进入的网站。if (standalone in navigator & !navigator.standalone & (/iphone|ipod|ipad/gi).test(navigator.platform) & (/Safari/i).test(navigator.appVersion) & window.orientation=90|window.orientation=-90) document.write();document.write();通过判断navigator.standalone来确定是否是从主屏幕图标来进入网站的。这个主要是应用在webapp端还是web端进入网站的。从而进行相应的操作。本例是navigator.standalone等于false即是从浏览器（web端）进入的网站的。那么在document文档中写入两段代码。4、取消浏览器默认行为：var preventDefaultScroll = function(event) event.preventDefault();window.scroll(0,0);return false;document.addEventListener(touchmove, preventDefaultScroll, false);取消浏览器默认行为，主要是为了控制一些手势事件。让它们按照具体的需求来进行相应的操作。核心代码是event.preventDefault();当手指滑动（touchmove）时进行触发。关于手指事件，我会专门开一贴进行讨论。5、手机加速度事件：var page=1;var xx=0;var jishu=0;function deviceMotionHandler(eventData) var acceleration = eventData.accelerationIncludingGravity;var zhuanhouX=Math.round(acceleration.x);if(xx-zhuanhouX3|xx-zhuanhouX10)var imgshu=$(“#yidongDiv”).find(“img”).length;var yidongJuli=$(“#rongqi”).width();if(!$(“#yidongDiv”).is(“:animated”)if(page=imgshu)$(“#yidongDiv”).animate(left:0px,500)page=1;$(“#changwenzi”).attr(“src”,”images/wenzi1.png”)else$(“#yidongDiv”).animate(left:-=+yidongJuli,500)$(“#changwenzi”).attr(“src”,”images/wenzi”+(page+1)+”.png”)page+;jishu=0;xx=0;window.addEventListener(devicemotion, deviceMotionHandler, false);这个例子中，是通过获取手机加速度，来进行一个动画的实例。在IOS5以上版本已经可以支持devicemotion事件。android4.0也开始支持这个事件。eventDat