jcrop thay đổi hình ảnh src sau khi tải trang

Question

Tôi đang sử dụng jcrop để cắt ảnh trực tiếp và muốn người dùng có tùy chọn thay đổi hình ảnh trước khi chúng bắt đầu cắt.

Vì một số lý do tôi không thể thay đổi hình ảnh.

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

Khi tôi nhìn vào các mã trong đom đóm nó cho thấy hai yếu tố img và một là bên trong một container jcrop không có id.

Tôi làm cách nào để thay đổi hình ảnh?

đang

#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 tạo ra một bản sao của hình ảnh của bạn để sử dụng cho trồng trọt. Bạn chỉ cần thay đổi bộ chọn như vậy:

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

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

Answer 2

Bạn có thể sử dụng setImage() chức năng. Khi bạn khởi tạo Jcrop, lưu đối tượng nó tạo ra, vì vậy bạn có thể gọi hàm này khi cần thiết.

var JCropper; 

$('#image').Jcrop({ 
    ..setup.. 
} function() { 
    // Save Jcrop object 
    JCropper = this; 
} 

JCropper.setImage('/newimage.jpg'); 

Answer 3

Nếu bạn muốn không chỉ thay đổi url nhưng loại bỏ tất cả các phong cách từ hình ảnh trước đó bạn phải làm như vậy:

$('#image').removeAttr('style');