Phonegap捕獲照片並上傳到服務器

-1

我在我的代碼中遇到了一個問題。每當我把我的功能uploadPhoto，功能capturePhotoWithFile將無法正常工作（我按下按鈕，但什麼都沒有發生）。但是，當我刪除函數uploadPhoto時，函數capturePhotoWithFile將再次工作（我可以按下按鈕並拍攝照片）。Phonegap捕獲照片並上傳到服務器

<!DOCTYPE html> 
<html> 
<head> 
<title>Capture Photo</title> 
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1"/> 
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
<script type="text/javascript" charset="utf-8"> 

var pictureSource; // picture source 
var destinationType; // sets the format of returned value 

document.addEventListener("deviceready",onDeviceReady,false); 

function onDeviceReady() { 
    pictureSource=navigator.camera.PictureSourceType; 
    destinationType=navigator.camera.DestinationType; 
} 

function onPhotoFileSuccess(imageData) { 
    console.log(JSON.stringify(imageData)); 
    var smallImage = document.getElementById('smallImage'); 
    smallImage.style.display = 'block'; 
    smallImage.src = imageData; 
} 

function capturePhotoWithFile() { 
    navigator.camera.getPicture(onPhotoFileSuccess, onFail, { quality: 50, destinationType:  Camera.DestinationType.FILE_URI }); 
} 

function onFail(message) { 
    alert('Failed because: ' + message); 
} 


function uploadPhoto() { 

    var imageData = document.getElementById('smallImage').getAttribute("src"); 
    if (!imageData) { 
     alert('Please select an image first.'); 
     return; 
    } 

    var options = new FileUploadOptions(); 
    options.fileKey = "file"; 
    options.fileName = imageData.substr(imageData.lastIndexOf('/')+1); 
    options.mimeType = "image/jpeg"; 

    } 

    var ft = new FileTransfer(); 
    ft.upload(imageData, encodeURI("uploadtest.php"), win, fail, options); 
    } 

    function onFail(message) { 
    console.log('Failed because: ' + message); 
    } 

    function win(r) { 
    console.log("Code = " + r.responseCode); 
    console.log("Response = " + r.response); 
    //alert("Response =" + r.response); 
    console.log("Sent = " + r.bytesSent); 
    } 

    function fail(error) { 
    alert("An error has occurred: Code = " + error.code); 
    console.log("upload error source " + error.source); 
    console.log("upload error target " + error.target); 
    } 

</script> 
</head> 
<body> 

<button onclick="capturePhotoWithFile();">Capture Photo</button> <br> 
<button onclick="uploadPhoto();">Upload</button> <br> 
<img style="display:none;width:60px;height:60px;" id="smallImage" src="" /> 
<img style="display:none;" id="largeImage" src="" /> 
</body> 
</html>

來源

2014-11-25 BlacKandy

試試這個方法：

function getPictureFromCamera(){ 
    navigator.camera.getPicture(onSuccess, onFail, { quality: 50, destinationType:Camera.DestinationType.FILE_URI }); 

    function onSuccess(imageURI) { 
     $('#camera-image').css({'background-image': 'url('+imageURI+')', 'background-size': '100%'}); 
    } 

    function onFail(message) { 
     console.log('Failed to get an image'); 
    }  
} 

function getPictureFromGallery(){ 
    navigator.camera.getPicture(onSuccess, onFail, { quality: 50, destinationType: Camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY }); 

    function onSuccess(imageURI) {    
     $('#camera-image').css({'background-image': 'url('+imageURI+')', 'background-size': '50%'}); 
    } 

    function onFail(message) { 
     console.log('Failed to get an image'); 
    }  
}

輸出：

enter image description here

來源

2014-11-25 13:38:58 Gattsu

Phonegap捕獲照片並上傳到服務器

回答

相關問題