jquery - jcrop在页面加载后更改图像src

Question

我使用 jcrop 进行即时图像裁剪，并希望用户可以选择在开始裁剪之前更改图像。

由于某种原因，我无法更改图像。

jsfiddle http://jsfiddle.net/UUKP4/2/

当我查看 firefly 中的代码时，它显示两个 img 元素，其中一个位于没有 id 的 jcrop 容器内。

如何更改图像？

代码

#jcrop_target {
width:200px;
}


$(function () {
$('#jcrop_target').Jcrop();
});

function chageImage() {
alert("hello");
$('#jcrop_target').attr('src', 'http://eofdreams.com/data_images/dreams/cat/cat-06.jpg');
}

<img src="http://jcrop-cdn.tapmodo.com/v0.9.10/demos/demo_files/pool.jpg" id="jcrop_target" />
<input type='button' value='change image' id='changeImage' onclick='chageImage();'>

Answer 1

JCrop 创建图像的副本以用于裁剪。您只需要像这样更改选择器:

$('.jcrop-holder img').attr('src', 'http://eofdreams.com/data_images/dreams/cat/cat-06.jpg');

http://jsfiddle.net/UUKP4/4/