将内容从父页面追加到新的浏览器窗口 [英] Append content to new browser window from the parent page

查看:64
本文介绍了将内容从父页面追加到新的浏览器窗口的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试将裁剪工具集成到我的网站(js插入

I am trying to integrate a cropping tool to my website (js plugging resizing cropping images canvas). This tool will let the user crop an image, open it in a new browser page, and give him the capacity to save the new image into the disk.

裁剪代码如下:

crop = function(){
    //Find the part of the image that is inside the crop box
    var crop_canvas,
    left = $('.overlay').offset().left - $container.offset().left,
    top =  $('.overlay').offset().top - $container.offset().top,
    width = $('.overlay').width(),
    height = $('.overlay').height();

    crop_canvas = document.createElement('canvas');
    crop_canvas.width = width;
    crop_canvas.height = height;

    crop_canvas.getContext('2d').drawImage(image_target, left, top, width, height, 0, 0, width, height);
    var newWindow = window.open(crop_canvas.toDataURL("image/png"));
}

现在,我想将一些HTML内容附加到newWindow正文中,但是它不起作用.我试图在 window.open 命令之后添加以下内容:

Now i want to append some HTML content to newWindow body, but it does not work. I tried to add the following after window.open command:

var text = document.createTextNode('Hello World !');
newWindow.document.body.appendChild(text);

但是什么都没有添加到新页面吗?

But nothing is added to the new page ?

如何使用父页面中的脚本将内容添加到新页面的正文中?(HTML内容,甚至是一些JavaScript代码)

How can add stuff to the body of the new page using the script from the parent page ? (Html content and even some javascript code)

谢谢!

推荐答案

var dataUri = crop_canvas.toDataURL("image/png"),
    newWindow = window.open("about:blank");

newWindow.document.write("<!DOCTYPE html>\n<body><img src='" + dataUri + "' /></body>");

var text = document.createTextNode('Hello World !');
newWindow.document.body.appendChild(text);

这篇关于将内容从父页面追加到新的浏览器窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆