跨平台开发:初探PhoneGap移动开发框架(4)
转载自http://mobile.51cto.com/android-229213_3.htm
改进HelloWorld程序
接下来我们改进下这个程序,实现的功能是我们可以在文本框里输入名字,然后点确定按钮后,弹出提示窗口显示Hello+你输入的名字。修改程序代码如下:
> <html> <head> <meta name="viewport" content="width=320; user-scalable=no" /> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>PhoneGaptitle> <script type="text/javascript" charset="utf-8" src="phonegap.js">script> <script type="text/javascript" charset="utf-8"> var displayHello = function() { var name = document.getElementById("firstname").value; navigator.notification.alert("name" + name); } script> head> <body onload="init();" id="bdy" > <div id="txt"> <input type="text" name="firstname" id="firstname" /> div> <div id ="btn"> <a href="#" class="btn" onclick="displayHello();">Say Helloa> div> div> body> html>
如果你懂得HTML和Javascript的话,上面的程序实在容易理解。其中我们添加了一个名为firstname的文本框,并且在按钮的onclick事件中调用的displayHello()方法中通过document.getElementById的Javascript方法获得了用户输入的名字,然后同样用navigator.notification.alert的方法输出结果,输入的界面和输出的结果如下图所示:
总结
通过PhoneGap这套开源框架对开发移动设备SDK的封装,我们今后在开发移动应用时,只需要调用PhoneGap封装好的API,结合已有的Java、HTML、CSS和Javascript技术,就可以很方便地进行开发了,更多的资料请查看PhoneGap的帮助文档。
相关推荐
yxwang0 2014-01-09
朱莉的乔夫 2015-03-13
acntw 2015-06-14
xiaonian 2013-01-24
quzishen 2013-07-17
故作坚强 2013-07-15
爱技术爱生活TAO 2013-07-06
临碣秘藏 2013-07-10
czpaex 2011-09-11
益之 2014-01-09
朱莉的乔夫 2014-09-05
朱莉的乔夫 2015-03-26
益之 2015-04-21
临碣秘藏 2015-05-12
quzishen 2016-01-20
爱技术爱生活TAO 2016-01-07
tenda 2012-09-08