Question

适用于PhoneGap 2.8.0中的Android：

我需要从手机图库中获取图片，并且需要在应用中插入...

我的代码：

HEAD

<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" href="css/jquery.mobile-1.0rc1.min.css" />
<link rel="stylesheet" href="css/styles.css" />

<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.0rc1.min.js"></script>
<script src="js/cordova.js"></script>

HTML：

<button data-theme="d" onclick="getPhoto(pictureSource.PHOTOLIBRARY);">Browse    Photos</button>

<div id="photos"></div>

SCRIPT ：

function onPhotoURISuccess(imageURI) {

var img = $('<img />');
img.attr('src', imageURI);


img.appendTo('#photos');

}

但它不起作用......我怎么能这样做？

我在控制台中遇到的错误

file：///android_asser/www/index.html:Uncaught typeerror：无法读取未定义的属性“PHOTOLIBRARY”

未捕获的类型错误：[Object Object]在文件中没有方法'split'：///android_asset/www/js/jquery.mobile-1.0rc1.min.js

我删除了jquery和jquery-mobile后它的工作......带有phonegap的jQuery有什么问题吗？

提前致谢

Answer 1

我已经实现了这段代码......最近......检查了这个

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">

var pictureSource;   
var destinationType; 

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

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


function onPhotoURISuccess(imageURI) 
{
    console.log(imageURI);
    var largeImage = document.getElementById('largeImage');
    largeImage.style.display = 'block';
    largeImage.src = imageURI;
}

function onPhotoDataSuccess(imageURI) 
{ 
    var imgProfile = document.getElementById('imgProfile');
    imgProfile.src = imageURI;
    if(sessionStorage.isprofileimage==1)
    {
        getLocation();
    }
    movePic(imageURI);
}

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

function movePic(file)
{ 
    window.resolveLocalFileSystemURI(file, resolveOnSuccess, resOnError); 
} 

function resolveOnSuccess(entry)
{ 
    var d = new Date();
    var n = d.getTime();
    var newFileName = n + ".jpg";
    var myFolderApp = "MyAppFolder";
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) 
    {      
        fileSys.root.getDirectory( myFolderApp,
                {create:true, exclusive: false},
                function(directory) 
                {
                    entry.moveTo(directory, newFileName,  successMove, resOnError);
                },
        resOnError);
    },
    resOnError);
}

function successMove(entry) 
{
    sessionStorage.setItem('imagepath', entry.fullPath);
}

function resOnError(error) 
{
    alert(error.code);
}

function capturePhotoEdit() 
{
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true,
    destinationType: destinationType.DATA_URL });
}

function getPhoto(source) 
{
    navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, 
    destinationType: destinationType.FILE_URI,
    sourceType: source });
}



</script>

我的HTML

<button onclick="capturePhoto();">Capture Photo</button>
<button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Gallery!!</button>

Answer 2

尝试此链接我希望它可能对您有所帮助

http://tympanus.net/codrops/2010/05/27/awesome-mobile-image-gallery-web-app/

参见api

http://docs.phonegap.com/en/2.8.0/index.html

你也尝试

如果是C amera.sourceType = Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM，则会显示照片选择器对话框，从中可以选择相册中的照片。

Answer 3

Hi blow是Camera和gallery的代码。我同时使用不同的功能，因为使用设备捕获可以捕获多个图像。

我希望它会对你有所帮助。

    <select>
    <option>--Select--</option>
    <option onclick="GetImage(1)">Camera</option>
    <option onclick="GetImage(2)">Library</option>
    <option onclick="GetImage(3)">Album</option>
    </select>


    //// fuction to select which type of upload you want to perform
    GetImage(index)
    {
        switch (index)
        {
            case 1:
                captureImage();
                break;
            case 2:
                getPhoto('pictureSource.PHOTOLIBRARY');
                break;
            case 3:
                getPhoto('pictureSource.SAVEDPHOTOALBUM');
                break;

        }

    }
    //// fuction calle from camera capture success
    function captureSuccess(mediaFiles) {
        var i, len;
        debugger;
        for (i = 0, len = mediaFiles.length; i < len; i += 1) {
            uploadFile(mediaFiles[i]);
        }
    }

    // Called if something bad happens.
    // 
    function captureError(error) {
        var msg = 'An error occurred during capture: ' + error.code;
        navigator.notification.alert(msg, null, 'Uh oh!');
    }

    //// function to camputure image from camera
    //
    function captureImage() {
        // Launch device camera application, 
        // allowing user to capture up to 2 images
        navigator.device.capture.captureImage(captureSuccess, capturetError, { limit: 1 });
    }

    //// Upload files to server
    function uploadFile(mediaFile) {
        var ft = new FileTransfer();
        path = mediaFile.fullPath;
        name = mediaFile.name;
////your s url

        var objUrl =www.xyx.com;         

        ft.upload(path,
            objUrl,
            function (result) {
                alert("Success");


            },
            function (error) {
                alert('Error uploading file ' + path + ': ' + error.code);
            },
            { fileName: name });
    }

    //// fuction to capture image from Gallery or PHOTOLIBRARY
    function getPhoto(source) {
        // Retrieve image file location from specified source
        var cameraSource;
        if (source = "pictureSource.PHOTOLIBRARY") {
            cameraSource = pictureSource.PHOTOLIBRARY;
        }
        if (source = "pictureSource.PHOTOLIBRARY") {
            cameraSource = pictureSource.SAVEDPHOTOALBUM;
        }

        navigator.camera.getPicture(CaptureImageSuccess, onFail, {

            quality: 50,
            destinationType: destinationType.FILE_URI,
            sourceType: cameraSource
        });
    }


    //// Upload files to server from Gallery
    function CaptureImageSuccess(fileURI) {
        ////your service url

        var objUrl =www.xyx.com;         

        var options = new FileUploadOptions();
            options.fileKey = "file";
            options.fileName = fileURI.substr(fileURI.lastIndexOf('/') + 1)+".jpg";
            options.mimeType = "image/jpeg";
            options.params = {}; // if we need to send parameters to the server request
            var ft = new FileTransfer();
            //ft.upload(fileURI, encodeURI(), win, fail, options);

            ft.upload(fileURI,
                objUrl,
                function (result) {
                    alert("Success");

                },
                function (error) {
                    alert('Error uploading file ' + path + ': ' + error.code);
                },
                options);
    };

从android图库中选择图片 - PhoneGap无法正常工作

3 个答案: