Question

我正在尝试使用Cordova API（在IBM Worklight中）拍摄照片，但成功回调似乎永远不会触发（当我在Backbone.js之外使用相同的代码时，它完美地工作）。

这是我的观点文件：

var app = app || {};

app.WalletView = Backbone.View.extend({

    el: '#page',

    template: Handlebars.getTemplate( 'wallet' ),

    events: {
        'click #camera-snap': 'getPhoto'
    },

    initialize: function() {
        this.render();
    },

    // render library by rendering each book in its collection
    render: function() {
        this.$el.html( this.template() );
        return this;
    },

    getPhoto: function(e) {
        var $img = this.$el.find('img#camera-image');
        console.info('Taking Photo');
        /*
         | BASED ON: http://stackoverflow.com/a/11928792/633056
         */
        navigator.camera.getPicture(
            function(data) {
                $img.show();
                alert(data);  // <-- success alert
                //img.src = "data:image/jpeg;base64," + data;
                $img.attr('src', "data:image/jpeg;base64," + data);
                $('#camera-status').text("Success");
            },
            function(e) {
                console.log("Error getting picture: " + e);
                $('camera-status').innerHTML = e;
                //dom.byId('camera-image').style.display = "none";
            },
            // must be DATA_URL to return the data for future use
            {quality: 50, destinationType: navigator.camera.DestinationType.DATA_URL, sourceType : navigator.camera.PictureSourceType.CAMERA}
        );
    }

});

这就是我发起这种观点的方式：

'showWallet': function() {
    new app.WalletView();
},

这是HTML模板：

<h1>Camera POC</h1>
<p>Camera Status: <i id="camera-status"></i></p>
<input type="submit" value="Take Picture" id="camera-snap">
<img src="" id="camera-image" style="width: 80%;">

单击input#camera-snap按钮将显示本机相机界面。然后我可以拍照并（在Android上）点击勾选按钮（在原生界面中）。但是，当我回到Hybrid应用程序时，没有任何事情发生。

我希望成功回调中的alert()能够弹出一大串BASE64数据（就像在Backbone中一样。

我做错了什么？

Answer 1

你可以在$ img.show（）调用之前的成功回调中添加一个console.log（$ img），如下所示吗？

var $img = this.$el.find('img#camera-image');
        console.info('Taking Photo');

        navigator.camera.getPicture(
            function(data) {
                console.log($img);     // <-- new console.log
                $img.show();
                alert(data);  
                ....
            },
            function(e) {
                ....
            },
            ....
        );
    }

可能是因为$ img变量在成功回调的范围内不可见，所以你的javascript在它到达警报之前就已经死了。

通过Backbone.js查看使用Cordova拍照

1 个答案: