网站地图    收藏   

主页 > 前端 > css教程 >

PhoneGap-----Device Infomation、Network State and four kinds

来源:自学PHP网    时间:2015-04-14 14:51 作者: 阅读:

[导读] The first , we can lead how to get the device Infomation ! It#39;s very convenient by Phonegap ! At least , I think so ![html]!DOCTYPE htmlhtml headtitleMy Dev......

 The first , we can lead how to get the device Infomation ! It's very convenient by Phonegap ! At least , I think so !


[html]
<!DOCTYPE html> 
<html > 
<head> 
<title>My Device</title> 
<script type="text/javascript" charset="utf-8" src="cordova.js"></script> 
<script type="text/javascript" charset="utf-8"> 
 
   function onLoad() 
   { 
       document.addEventListener("deviceready",onDeviceReady,false); 
   } 
    
   function onDeviceReady() 
   { 
       var myDiv = document.getElementById('props'); 
       myDiv.innerHTML = 'Device Name:    ' + device.name     + '<br />' +  
                         'Device PhoneGap:' + device.phonegap + '<br />' +  
                         'Device Platform:' + device.platform + '<br />' + 
                         'Device UUID:    ' + device.uuid     + '<br />' + 
                         'Device Version: ' + device.version  + '<br />' ; 
   } 
    
</script> 
</head> 
<body onLoad="onLoad()"> 
   <p id="props">Loading device properties...</p> 
</body> 
</html> 

<!DOCTYPE html>
<html >
<head>
<title>My Device</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">

   function onLoad()
   {
    document.addEventListener("deviceready",onDeviceReady,false);
   }
  
   function onDeviceReady()
   {
    var myDiv = document.getElementById('props');
    myDiv.innerHTML = 'Device Name:    ' + device.name     + '<br />' +
                      'Device PhoneGap:' + device.phonegap + '<br />' +
       'Device Platform:' + device.platform + '<br />' +
       'Device UUID:    ' + device.uuid     + '<br />' +
       'Device Version: ' + device.version  + '<br />' ;
   }
  
</script>
</head>
<body onLoad="onLoad()">
   <p id="props">Loading device properties...</p>
</body>
</html>
    The second , we can check the network state : 


[html]
<!DOCTYPE html> 
<html > 
<head> 
<title>Connectivity Example</title> 
<script type="text/javascript" charset="utf-8" src="cordova.js"></script> 
<script type="text/javascript" charset="utf-8"> 
 
   document.addEventListener("deviceready",onDeviceReady,false); 
    
   function onDeviceReady() 
   { 
      checkConnection(); 
   } 
    
   function checkConnection() 
   { 
       var networkState = navigator.network.connection.type; 
        
       var states = {}; 
       states[Connection.UNKNOWN] = 'Unknown connection'; 
       states[Connection.ETHERNET] = 'Ethernet connection'; 
       states[Connection.WIFI] = 'Wifi connection'; 
       states[Connection.CELL_2G] = 'Cell 2G connection'; 
       states[Connection.CELL_3G] = 'Cell 3G connection'; 
       states[Connection.CELL_4G] = 'Cell 4G connection'; 
       states[Connection.NONE] = 'No network connection'; 
        
       alert('Connection type:' + states[networkState]); 
   } 
    
</script> 
</head> 
<body> 
   <p>A dialog box will report the network state.</p> 
</body> 
</html> 

<!DOCTYPE html>
<html >
<head>
<title>Connectivity Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">

   document.addEventListener("deviceready",onDeviceReady,false);
  
   function onDeviceReady()
   {
   checkConnection();
   }
  
   function checkConnection()
   {
    var networkState = navigator.network.connection.type;
   
    var states = {};
    states[Connection.UNKNOWN] = 'Unknown connection';
    states[Connection.ETHERNET] = 'Ethernet connection';
    states[Connection.WIFI] = 'Wifi connection';
    states[Connection.CELL_2G] = 'Cell 2G connection';
    states[Connection.CELL_3G] = 'Cell 3G connection';
    states[Connection.CELL_4G] = 'Cell 4G connection';
    states[Connection.NONE] = 'No network connection';
   
    alert('Connection type:' + states[networkState]);
   }
  
</script>
</head>
<body>
   <p>A dialog box will report the network state.</p>
</body>
</html>

    The third , the cases of four kinds of notifications : 


[html]
<!DOCTYPE html> 
<html> 
<head> 
<title>PhoneGap Event Example</title> 
 
<script type="text/javascript" charset="utf-8" src="cordova.js"></script> 
<script type="text/javascript" charset="utf-8"> 
 
   function onLoad() 
   { 
       document.addEventListener("deviceready",onDeviceReady,false); 
   } 
    
   function onDeviceReady(){ 
   } 
    
   function showAlert(){ 
       navigator.notification.alert( 
         'Game Over!',//message 
         alertCallback,//callback 
         'Game Over', 
         'Done'//buttonName 
         ); 
   } 
    
   function alertCallback(){ 
   } 
    
   function onConfirm(button){ 
       alert('You selected button ' + button); 
   } 
    
   function showConfirm(){ 
       navigator.notification.confirm( 
         'Game Over!', 
         onConfirm, 
         'Game Over', 
         'Restart,Exit' 
         ); 
   } 
    
   function playBeep(){ 
       navigator.notification.beep(2); 
   } 
    
   function vibrate(){ 
       navigator.notification.vibrate(4000); 
   } 
    
</script> 
</head> 
<body onLoad="onLoad()"> 
   <p><a href="#" onClick="showAlert();return false;">Show Alert</a></p> 
   <p><a href="#" onClick="showConfirm();return false;">Show Confirmation</a></p> 
   <p><a href="#" onClick="playBeep();return false;">Play Beep</a></p> 
   <p><a href="#" onClick="vibrate();return false;">Vibrate</a></p> 
</body> 
</html> 

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论