JavaScript在混合应用程序中不起作用

时间:2016-08-22 02:54:10

标签: javascript android html5 hybrid-mobile-app

我正在使用HTML5,JavaScript和IDE(eclipse)构建混合Android应用程序。

在我的应用中,我制作了两个html页面。一个是index.html,另一个是camera.html。

[index.html的]



<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
	<meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
	<script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript" src="cordova.js"></script>
</head>
 
<body>
	<div data-role="page" id="index" style="width:100%; height:100%">
	    <div data-role="header">
	    	<h1 class="title">Read Database</h1>
	    </div>
	    <div data-role="content">
	     	<ul data-role="listview" data-inset="true" id="result"></ul>
	    </div>
	    <div data-role="footer">
	        <a href="insert.html" data-role="button" >Insert Data</a>
	        <a href="camera.html" data-role="button" >Camera/a>
		</div>
	</div>
</body>
</html>
&#13;
&#13;
&#13;

[camera.html]

&#13;
&#13;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
	<meta name="viewport" content="width=device-width, initial-scale=1" />
	<script>
	    var pictureSource;  
		var destinationType;  
		document.addEventListener("deviceready",onDeviceReady,false);
		
		function onDeviceReady() {
		    pictureSource=navigator.camera.PictureSourceType;
		    destinationType=navigator.camera.DestinationType;
		}
		function onPhotoDataSuccess(imageData) {
		  var smallImage = document.getElementById('smallImage');
		  smallImage.style.display = 'block';
		  smallImage.src = "data:image/jpeg;base64," + imageData;
		}
		function onPhotoURISuccess(imageURI) {
		  var largeImage = document.getElementById('largeImage');
		  largeImage.style.display = 'block';
		  largeImage.src = imageURI;
		}
		function capturePhoto() {
		  navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
		    correctOrientation : true,
		    destinationType: destinationType.DATA_URL });
		}
		function capturePhotoEdit() {
		   navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, 
		    allowEdit: true, //android에서는 특별한 효과 없음, 무시됨
		    correctOrientation : true,
		    destinationType: destinationType.DATA_URL });
		}
		function getPhoto(source) {
		  navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
		    correctOrientation : true, 
		    destinationType: destinationType.FILE_URI,
		    sourceType: source });
		}
		function onFail(message) {
		  alert('Failed because: ' + message);
		}
	</script>
</head>
 
<body>
	<div data-role="page" id="camera" style="width:100%; height:100%">
	    <div data-role="header">
	    	<h1 class="title">Camera</h1>
	    </div>
	    <div data-role="content">		
		    <img style="display:none; wdith:100%; height:100%" id="largeImage" src=""/>
		</div>
	    <div data-role="footer">	        
	    	 <a href="index.html" data-role="button" >Main</a>
	        <button onclick="capturePhoto();">Capture Photo</button> <br>
		    <button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br>
		    <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>
		    <button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br>
		    <img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
		</div>
	</div>
</body>
</html>
&#13;
&#13;
&#13;

如果在这些代码中看到,我使用A标签按钮将index.html连接到camera.html。

当我按下并移动此按钮时,JavaScript无效。

从index.html页面移动到另一个页面时,除了index.html中的JavaScript代码外,它无法正常工作。

enter image description here

这张照片是我在混合应用程序中按下按钮的结果。

我该如何解决这个问题?

[更新] [MainActivity.java]

&#13;
&#13;
/*
       Licensed to the Apache Software Foundation (ASF) under one
       or more contributor license agreements.  See the NOTICE file
       distributed with this work for additional information
       regarding copyright ownership.  The ASF licenses this file
       to you under the Apache License, Version 2.0 (the
       "License"); you may not use this file except in compliance
       with the License.  You may obtain a copy of the License at

         http://www.apache.org/licenses/LICENSE-2.0

       Unless required by applicable law or agreed to in writing,
       software distributed under the License is distributed on an
       "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
       KIND, either express or implied.  See the License for the
       specific language governing permissions and limitations
       under the License.
 */

package app.su.project;

import android.os.Bundle;
import org.apache.cordova.*;

public class MainActivity extends CordovaActivity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        // Set by <content src="index.html" /> in config.xml
        loadUrl(launchUrl);
    }
}
&#13;
&#13;
&#13;

0 个答案:

没有答案