捕获图像导航到不同页面后的HTML5图像捕获

Question

我正在使用HTML5，CSS3，JavaScript，jQuery，jQuery mobile开发移动Web应用程序。我正在使用HTML5 Image Capture来捕获图像。捕获图像后，页面将导航到不同的页面。请为此问题提出一些解决方案。

被修改

我在onchange事件中使用的以下代码。

 $.mobile.hidePageLoadingMsg("loadingNotification");
   // var input = document.querySelector("imageCaptureFile");
    var input = document.querySelector('input[type=file]');
    var file = input.files[0];
    if (file == undefined) {
        $.mobile.hidePageLoadingMsg("loadingNotification");
    }
    var reader = new FileReader();
    reader.onload = function (e) {
        var actualImage = e.target.result;
        var canvas = document.getElementById('CanvasImage');
        var ctx = canvas.getContext('2d');
        var image = new Image();
        image.onload = function () {
            var MAX_WIDTH = 700;
            var MAX_HEIGHT = 600;
            var width = image.width;
            var height = image.height;
            if (width > height) {
                if (width > MAX_WIDTH) {
                    height *= MAX_WIDTH / width;
                    width = MAX_WIDTH;
                }
            } else {
                if (height > MAX_HEIGHT) {
                    width *= MAX_HEIGHT / height;
                    height = MAX_HEIGHT;
                }
            }


            canvas.width = 1700;
            canvas.height = 1700;
            ctx.drawImage(image, 0, 0, 1600, 1600);
            // ctx.drawImage(image, 0, 0);
        };
        image.style.width = "100%";
        image.style.height = "100%";
        image.src = actualImage;
        setTimeout(function () {
            var convertedImage = canvas.toDataURL("image/jpeg");
            //var convertedImage = actualImage;
            var count = 0;
            var imageCaptureId = GuidGenerator(); //To generate GUID for custom action

            var $ulActionImage = $('#ulActionImage');
            var liImageCapture = "";
            liImageCapture += "<li id=" + imageCaptureId + "" + count + " >";
            var ActionImageCount = document.getElementsByName("aActionImages");
            var ImageCount = ActionImageCount.length + 1;
            liImageCapture += "<a href='#' id='" + auditId + "" + imageCaptureId + "' type='Show" + imageCaptureId + "'  name='aActionImages' onclick='ShowImages(this.type,this.id)'><h3>Image " + ImageCount + "</h3></a><a href='#' id='" + imageCaptureId + "' type=" + count + " onclick='DeleteActionImage(this.id,this.type)'></a>";
            liImageCapture += "</li>";
            $ulActionImage.append(liImageCapture);
            $ulActionImage.listview('refresh');
            $.mobile.hidePageLoadingMsg("loadingNotification");
        }, 1000);
    };
    reader.readAsDataURL(file);