0

得到错误

"11-13 13:10:55.470: E/Web Console(9799): 
Uncaught Error: TYPE_MISMATCH_ERR: DOM Exception 17 at
file:///android_asset/www/index.html:304"

在使用 phonegap 将 html div 内容转换为 android 中的画布时。

它在浏览器上正常工作。任何帮助将不胜感激。我正在使用 jQuery-1.9.1,jQuery-UI。

代码片段:

// html文件

    <html>
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Draggable - Default functionality</title>
    <link rel="stylesheet" href="resourcess/css/jquery-ui.css" />
    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/html2canvas.js"></script>
    <script src="js/jquery.plugin.html2canvas.js"></script>
    <script src="js/jquery-ui.js"></script>
    <script src="js/jquery.ui.touch-punch.min.js"></script>
    <script src="cordova-2.5.0.js"></script>
    <link rel="stylesheet" href="resourcess/css/style.css" />
  </head>
<body>

    <div class="imag-container">
        <div class="dragImg">

    <div id="dropHere"></div>
    <div id="click" > click </div>

    <div id="img-check">check</div>
    <canvas id="canvas" width="100" height="100">
        This text is displayed if your browser does not support HTML5 Canvas.
    </canvas>
</body>

// 脚本

    $(function(){  
            //Make every clone image unique.  
            var counts = [0];
            var resizeOpts = { 
                handles: "all" ,autoHide:true
            }; 

            $(".dragImg").draggable({
                helper: "clone",
                //Create counter
                start: function() { counts[0]++; }
            });

            $("#dropHere").droppable({
                drop: function(e, ui){
                    if(ui.draggable.hasClass("dragImg")) {
                        $(this).append($(ui.helper).clone());
                        //Pointing to the dragImg class in dropHere and add new class.
                        $("#dropHere .dragImg").addClass("item-"+counts[0] );
                        $("#dropHere .img").addClass("imgSize-"+counts[0]);

                        //Remove the current class (ui-draggable and dragImg)
$("#dropHere .item-"+counts[0]).removeClass("dragImg ui-ggable ui-draggable-dragging");

                        $(".item-"+counts[0]).dblclick(function() {
                            $(this).remove();
                        });     
                        make_draggable($(".item-"+counts[0])); 
                        $(".imgSize-"+counts[0]).resizable(resizeOpts);     
                    }

                }
            });


            var zIndex = 0;
            function make_draggable(elements)
            {   
                elements.draggable({
                    containment:'parent',
                    start:function(e,ui){ ui.helper.css('z-index',++zIndex); },
                    stop:function(e,ui){
                    }
                });
            }    

            $('#click').click(function(){
                //Some code

                var domElement = document.getElementById('dropHere');

                setTimeout(function() {

                    var canvas = document.getElementById("canvas"),
                    context = canvas.getContext('2d');


                    html2canvas(domElement, {

                        onrendered: function (domElementCanvas) {

                            var canvas = document.getElementById("canvas");

       canvas.getContext('2d').drawImage(domElementCanvas, 0, 0, 50, 50,0,0,100,100);

                        }
                    });
                }, 10000);


            });

        });
4

0 回答 0