javascript - 如何仅使用 jquery 执行图像裁剪并将该图像显示在另一个页面的 div 中

Question

我已经使用以下代码浏览并上传了图像。现在我需要从该图像中裁剪特定部分，并让它在另一个 html 页面的 div 中显示该裁剪区域。参考这个小提琴

html:

<input type="file" accept="image/*" id="image" />
<img id="img" />

查询：

 document.getElementById("image").addEventListener('change',function(e){
        var url = window.URL.createObjectURL(e.target.files[0]);
        alert(url);
        document.getElementById("img").src = url;
    },false);