如何为Phonegap制作可点击按钮?

时间:2014-11-30 14:36:35

标签: javascript android cordova button

我正在使用 Phonegap 制作应用。现在我的屏幕上有按钮,但是当我点击它们时没有任何反应,我的javascript代码说它应该转到另一个页面。这是我的 javascript 代码,任何人都可以告诉我它的错误或如何使其有效?

*function loadScript() {
// Wait for device to be ready loading everything
    //document.addEventListener('deviceready', onDeviceReady, false);
onDeviceReady(); 
};
// When device is ready
function onDeviceReady() {
    document.getElementById('nav1').addEventListener('mousedown', nav1Down, false);
    document.getElementById('nav1').addEventListener('mouseup',  page1Show, false);
    document.getElementById('nav2').addEventListener('mousedown', nav2Down, false);
    document.getElementById('nav2').addEventListener('mouseup',  page2Show, false);
    document.getElementById('nav3').addEventListener('mousedown', nav3Down, false);
    document.getElementById('nav3').addEventListener('mouseup',  page3Show, false);
};
// Add some GUI to the touch events
function nav1Down() {
    document.getElementById('nav1').className='down';
};
function nav2Down() {
    document.getElementById('nav2').className='down';
};
function nav3Down() {
    document.getElementById('nav3').className='down';
};
// Activate the tabs
function page1Show() {
    document.getElementById('page1').className='show';
    document.getElementById('page2').className='hide';
    document.getElementById('page3').className='hide';
    document.getElementById('nav1').className='up';
};
function page2Show() {
    document.getElementById('page1').className='hide';
    document.getElementById('page2').className='show';
    document.getElementById('page3').className='hide';
    document.getElementById('nav2').className='up';
};
function page3Show() {
    document.getElementById('page1').className='hide';
    document.getElementById('page2').className='hide';
    document.getElementById('page3').className='show';
    document.getElementById('nav3').className='up';
};
$( document ).ready(function() {
};*

1 个答案:

答案 0 :(得分:0)

以下示例代码显示了如何触发设备就绪事件。

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>
    <!-- plugin bridge js -->
    <script src="js/device.js"></script>
  </head>
  <body on-load="initDevice()"> 
  <button>Test button</button>          
  </body>
</html>

在device.js

 //call the function when page is loaded
    function initDevice(){
       document.addEventListener('deviceready', onDeviceReady, false);
    }
    function onDeviceReady(){
      alert("Device is ready");
    //call the button function 
     test();
    }
function test(){

  alert("another function call");
}

注意: 确保在加载任何设备api之前触发设备就绪事件。