2015-05-17 2 views
1

Я использовал fengyuanchen/cropper v0.9.2 для обрезки изображения и вращения в бутстрап-модальном режиме. Он отлично работает как для урожая, так и для вращения, но проблема в том, что он сохраняет первое изображение в модальном после урожая, предположим, что я открыл изображение в модальном, обрезал его, сохранил (с сервера) и отклонил модальный. Затем, если я снова открою изображение, но он покажет старое изображение, а не обрезанное. Но если я перезагружу страницу, она покажет обрезанный. Ниже приведен код, который я использовал.fengyuanchen cropper не показывает обрезанное изображение без перезагрузки страницы в bootstrap modal. Он сохраняет первое изображение

$(document).on('click', '.original_image_show', function() { //click on the image 
var data_original = $(this).find('img').attr('data-original');/ //get the src to to crop 
// #originalImageShow is the modal div's id. 
$("#originalImageShow").find(".bootstrap-modal-cropper img").attr('src', data_original); //set the src of bootstrap modal from clicked image's src. 


var $image = $('.bootstrap-modal-cropper > img'); 
$('#originalImageShow').on('shown.bs.modal', function() { 
     //-----cropping code here----- 
     }).on('hidden.bs.modal', function() { 
    $image.cropper('destroy');//I have used this code to destroy the modal. 
}); 

любая помощь?

ответ

0

У меня проблема, это было для кэширования изображения. Когда я сначала нажимаю изображение, затем браузер кэширует изображение, а затем он показывает старое изображение из кеша, а не обрезанное.

var data_original = $(this).find('img').attr('data-original');/ //get the src to to crop 
var data_original = data_original+ '?'+Math.random()*Math.random(); 
// #originalImageShow is the modal div's id. 
$("#originalImageShow").find(".bootstrap-modal-cropper img").attr('src', data_original); //set the src of bootstrap modal from clicked image's src. 

Путем добавления " '?' + Math.random() * Math.random()" с СРК изображения решена проблема кэширования.

Смежные вопросы