如何处理phonegap插件

时间:2012-02-10 17:17:54

标签: cordova phonegap-plugins

我的问题是,如果我在index.html中调用插件的函数,则会出现以下错误。

02-10 16:48:31.606: D/PhoneGapLog(24149): Uncaught TypeError: Cannot call method 'toDataURL' of undefined

我想使用canvas插件,它在index.html中工作但在其他页面中没有...我如何更改此调用:

window.plugins.canvas.toDataURL(canvas, "image/png", success, failure);

其他插件也有同样的问题, - 如何在相关页面中实现它们?

问候

代码:

<body>
    <div data-role="page" id="some_id">     

    <style type="text/css">
        #img {
            position:absolute;
            top:20px;
            left:20px;
            width: 400px;
            height: 400px;
            border: 1px solid;
            border-color: #458d91;
            -moz-border-radius:16px;
            -khtml-border-radius:16px;
            font-family: Verdana, Arial, Helvetica, sans-serif;
            font-size: 10px;
            padding-top: 10px;
            padding-left:10px;
            padding-right:10px;
            padding-bottom: 10px;
        }
        </style>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script>
    <script type="text/javascript" charset="utf-8" src="jquery.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="canvas.js"></script>
    <script type="text/javascript" charset="utf-8" src="jquery.mobile-1.0.min.js"></script>

    <script type="text/javascript">

    try {
        var canSave = false;
        var b_canvas;
        function init() {

            document.addEventListener('deviceready', function() {
                canSave = true;
            });

            b_canvas = document.getElementById('cid');
            var b_context = b_canvas.getContext('2d');
            b_context.fillRect(50, 25, 150, 100);
        }
        function saveImg() {

            if (canSave) {

                window.plugins.canvas.toDataURL(b_canvas, "image/png", success, failure);
                function success(arg) {

                    if (arg.size > 0) {
                        var oImgElement = document.createElement("img");
                        oImgElement.src = arg.data;
                        document.getElementById('img').appendChild(oImgElement);
                    } else {            
                        alert("Canvas Write Error: " + arg.debug);
                    }
                }
                function failure(arg) {
                    alert("failure: " + arg);
                }
            }
        }
    } catch(err) { alert(err); }

    </script>

    <br/><br/>
    <a href="#" onclick="init();">init</a>
    <br><br>
    <a href="#" onclick="saveImg();">SAVE</a>
    <div id="img" style="float: left; border: 1px dotted;"></div>
    <br clear="both"/>
    <div style="margin-top: 130px; float: right;">
        <canvas id="cid" width="300" height="225"></canvas>
    </div>


</div>
</body>

1 个答案:

答案 0 :(得分:1)

您需要在要使用该插件的每个页面上加载插件JavaScript和phonegap.js。